Wie ein Kontrollkästchen bei Verwendung von ng-Tabelle in Angular 2 eingeben?

Question

Um eine Tabelle mit ng-table in Angular 2 zu erstellen ist einfach, aber jetzt möchte ich Checkbox-Spalte in der Vorderseite der Tabelle, so dass jedes Mal, wenn eine bestimmte Zeile ausgewählt ist, seine Daten auch ausgewählt werden würde.

table.html enthält

<ng-table [config]="config" 
    (tableChanged)="onChangeTable(config)" 
    (cellClicked)="onCellClick($event)" 
     [rows]="rows" [columns]="columns">   
</ng-table> 

Table.ts enthält

@Component({ 
    moduleId: module.id, 
    selector: 'table', 
    templateUrl: 'table.component.html', 
    styleUrls: ['table.component.css'] 
}) 

export class TableComponent implements OnInit { 
public rows:Array<any> = []; 
public columns:Array<any> = [ 
{title: 'Fruits', name: 'Description', filtering: {filterString:  '', placeholder: 'Filter by description'}}, 
{title: 'Colour', name: 'Colour', sort: '', filtering: {filterString: '', placeholder: 'Filter by colour'}}, 
{title: 'Size', name: 'Size'} 
]; 

public config:any = { 
paging: true, 
sorting: {columns: this.columns}, 
filtering: {filterString: ''}, 
className: ['table-striped', 'table-bordered'] 
}; 

Ich bin verwirrt, wie Checkbox Funktion in dieser Tabelle zu implementieren. Es wäre dankbar, wenn Sie ein wenig Wissen über Angular 2 teilen könnten.

Answer 1

ng-table unterstützt HTML als Zelleninhalt. Setzen Sie das Kontrollkästchen html für die Eingabe in die Zeilendaten für eine Checkbox-Spalte.

Es unterstützt jedoch nicht Angular Komponenten oder Direktiven - nur reines HTML. Sie können weiterhin ein Kontrollkästchen erstellen, das ein Ereignis ausstrahlt, das Sie mit reinem HTML/JavaScript hören können.

Es ist nicht dokumentiert ist, aber Sie können dies in der Quelle sehen:

https://github.com/valor-software/ng2-table/blob/development/components/table/ng-table.component.ts

Beachten Sie, dass sanitize wirklich in diesem Fall das Gegenteil von sanitize ist - es die HTML als sicher markiert, unabhängig davon, was drin ist . Dies ist gut für das, was Sie wollen (obwohl wahrscheinlich in anderen Situationen unsicher).