更改ListView中當前選定項目的背景色的問題 - Nativescript/Angular2

Question

我忙於使用Nativescript/Angular2應用程序，在該應用程序中顯示活動股票列表需要使用ListView。我正在嘗試更改當前選定庫存的背景顏色，並將ListView中的項目顯示爲當前選定的StockTake。我將css類添加到ng-template中的StackLayout中，但由於某種原因，當我點擊一個項目時，css並未應用。任何想法在這裏可能會出現什麼問題/我該如何解決這個問題？所以我完全失去至於什麼問題可能是在這裏，我沒有得到任何錯誤...

my ListView xml code: 

    <ListView [items]="activeStockTakes" class="list-group"> 
         <ng-template let-activeStockTake="item" let-i="index"> 
          <StackLayout [class.highlight]="item.isSelected" (tap)="selectActiveStockTake(item, index)"> 
           <Label class="list-group-item" [text]="activeStockTake.UserCode + ' - ' + activeStockTake.Comment"></Label> 
          </StackLayout> 
         </ng-template> 
        </ListView> 


    my css code: 

    .highlight { 
     background-color: red !important; 
     border-radius: 3; 
    } 

    my selectActiveStockTake event: 

selectActiveStockTake(item, index) { 
    //console.log(args.index); 
    this.selectedActiveStockTake = this.activeStockTakes[index]; 
    this.selectedActiveStockTake.isSelected = true; 
    console.log(this.selectedActiveStockTake.UserCode); 
} 

Answer 1

嘗試

<ListView [items]="activeStockTakes" class="list-group"> 
    <ng-template let-activeStockTake="item" let-i="index"> 
     <StackLayout [class.highlight]="item.isSelected" (tap)="selectActiveStockTake(item, i)"> 
      <Label class="list-group-item" [text]="activeStockTake.UserCode + ' - ' + activeStockTake.Comment"></Label> 
     </StackLayout> 
    </ng-template> 
</ListView> 

然後：

selectActiveStockTake(item, i) { 
    item.isSelected = !item.isSelected; 
} 

這是一個更清潔的解決方案，應該完美地工作。