アンギュラ4の選択した複数の行をハイライト表示する方法

アンダーライン4の複数の選択行を強調表示する方法アンギュラ4の選択した複数の行をハイライト表示する方法

ここではチェックボックスで編集して他の操作も実行できます。私が探しているのは、チェックされている行を強調表示することです。

<tbody> 
    <tr *ngFor='let row of rowData' [ngClass]="{ 'selected': row.selected }"> 
    <td class="text-center> 
     <input type="checkbox" [(ngModel)]="row.selected" /> 
    </td> 
    <td> 
     <input type="text" *ngIf="row.editable" [(ngModel)]="row.name" /> 
     <ng-container *ngIf="!row.editable">{{row.name}}</ng-container> 
     <!-- You can use span or whatever instead of ng-container--> 
    </td> 
    <!-- Repeat for other cells -->  
    </tr> 
</tbody>

出典

2017-09-11 Nawab Ahmad

に真であるとき、今ではクラスselectedを追加します角度クラスディレクティブ

<tr *ngFor='let row of rowData' [class.selected]="row.selected">

を使用するシンプルな死んでいるあなたはあります何かエラーがありますか？確認できますか？ –

これは私のコードの単なるスナップです。私は複数の行を強調するロジックを探しています。 –

私の友人には、SOとGoogleの両方で利用可能な質問がたくさんあります。あなたはそれをチェックしていない？ https://stackoverflow.com/questions/35167463/angular2-how-bind-to-select-multiple –

行を強調表示するには、セル（<td>）を強調表示する必要があります。私が知っていることから、行を強調表示することはできません。ここで

はロジックです：

<tbody> 
    <tr *ngFor='let row of rowData'> 
    <td class="text-center" [class.selected]="row.selected"> 
     <input type="checkbox" [(ngModel)]="row.selected" /> 
    </td> 
    <td [class.selected]="row.selected"> 
     <input type="text" *ngIf="row.editable" [(ngModel)]="row.name" /> 
     <ng-container *ngIf="!row.editable">{{row.name}}</ng-container> 
     <!-- You can use span or whatever instead of ng-container--> 
    </td> 
    <!-- Repeat for other cells -->  
    </tr> 
</tbody>

出典

2017-09-11 06:50:04 trichetriche

単にrow.selectedが行

出典

2017-09-11 09:44:20

アンギュラ4の選択した複数の行をハイライト表示する方法

答えて

関連する問題