web-dev-qa-db-ja.com

Angular 2 ngClassデータ付き条件付き？

したがって、オブジェクトがすでに選択されている場合は、基本的にハイライトを設定しようとしています。オブジェクトを比較してクラスを変更するにはどうすればよいですか？このようなもの

<[ngClass]="{{perkResult.perk === perk.perk}} ? 'highlight' : 'none-hightlight' ">

現在のコード：

<div class="col-xs-12">
  <div class="col-xs-12 benefit-selection">
     <ul class="benefits-dropdown-ul" *ngIf="perkList"> .     
      <a class="benefits-dropdown-div" *ngFor="let perkResult of perkList.results" (click)="onAddPerk(perkResult)">
       //highlight here
        <li class="benefits-dropdown-li">{{ perkResult.perk }}</li>
      </a>
     </ul>
  </div>
 </div>

 <div class="col-xs-6 benefit-selected" *ngFor="let perk of company.perks; trackBy: customTrackBy; let i = inde
    {{ perk.perk }}
 </div>
cssangularconditionalng-class
6
Kenzo

補間ブラケットは必要ありません{{}}。この場合、 [ngClass]は式を探しているため、

[ngClass]="perkResult.perk === perk.perk ? 'highlight' : 'none-hightlight'"

または

[ngClass]="[perkResult.perk === perk.perk ? 'highlight' : 'none-hightlight']"

働くでしょう。

11
LLai