typescript - Angular 2 ngx-Datatable celltemplate

Jag försöker implementera cellTemplates i ngx-Datatable (https://github.com/swimlane/ngx-datatable) men kan inte lista ut varför det inte fungerar.

Först min åsikt

<ngx-datatable [rows]="skifte?.utsade" [columnMode]="flex" [selectionType]="'single'" [columns]="columns" (select)='edit($event)'></ngx-datatable>

Jag har en mallklass som ser ut så här.

import { Component, TemplateRef, ViewChild } from '@angular/core';
@Component({
moduleId: module.id,
selector:'',
template:"
<template #checkbox let-row="row" let-value="value" let-i="index">
    <md-checkbox checked="value === 'true'"></md-checkbox> 
</template>"
})
export class CellTemplates{

@ViewChild('checkbox') public checkbox: TemplateRef<any>;

constructor(){

 }    
}

Och försök att använda det så här. Men det finns inga förändringar i stilen på den cellen.

@Component({
moduleId: module.id,
selector: 'dv-utsade-table',
templateUrl: 'UtsadeTableComponent.html'

})
export class UtsadeTableComponent extends InsatsComponentBase {

columns : any[];
constructor(private dialogService: DialogService) {
    super();
}
ngAfterViewInit(){
 window.setTimeout(() =>
     this.columns =  [{ name: 'Körning', prop: 'korning'  },
        { name: 'benamning' },
        { name: 'giva' },
        { name: 'areal' },  
        { name: 'Utförd', prop: 'utford', cellTemplate: new CellTemplates().checkbox } //<----Here,
        { name: 'datum' },
        { name: 'Huvudgröda', prop: 'huvudgroda' },
        { name: 'Gödsel', prop: 'godsel.benamning' },
        { name: 'Giva', prop: 'godsel.giva' }
        ]
    )
 }
}

Svar #1

För det första har ngx-datatable

kryssbar: boolean

Anger om kolumnen ska visa en kryssrutekomponent för urval. Gäller endast när urvalsläget är kryssruta.

så att du kan berätta för det att din kolumn ska vara av kryssrutor. För det andra, om du verkligen behöver en anpassad mall med en komponent måste du skapa en giltig komponent och du kan sedan inkludera den i en mall som ska användas i en cell:

<template #chkBxTmpl let-row="row" let-value="value" let-i="index">
  <checkbox-component [state]="value"></checkbox-component>
</template>

och i komponenten:

@ViewChild('chkBxTmpl') chkBxTmpl: TemplateRef:<any>; 
    ....
   this.columns = [
       ...
      {
        cellTemplate: this.chkBxTmpl, 
        prop: 'checked',
        name: 'checked',
        width: 100
      }
    ....
   ];