ng-repeat kullanarak eşleşen öğeler üzerinde etkin sınıf nasıl eklenir

Question

Birden çok açılır seçme üzerinde çalışıyorum, ancak aynı zamanda bir liste öğesinin tek tek seçilmesine de izin verir. Seçici bir eleman değil, bir açısal bileşende verileri tutan bir tr.

Geçerli satırın ve ng-modeliyle iletilen değerin aynı olup olmadığını görmek için ctrl.checkEquality içindeki denetleyicinin içinde angular.equals kullanıyorum; Temel olarak, sahip olduğum kodla benzer bir şey yapıp yapamayacağımı merak ediyorum, ancak ng-modelini kurdum, böylece "ctrl" tuşuna basıldığında mulit-seçilmiş değer dizisine aktif sınıf uygular.

<tr ng-repeat="row in ctrl.filteredItems" ng-class="{'active': ctrl.checkEquality(row, ctrl.ngModel) ng-mousedown="ctrl.onSelectedLocal(row, $event)"> 
</tr> 

    public onSelectedLocal(row: ng.IAugmentedJQuery, $event: ng.IAngularEvent) { 
     if ($event["ctrlKey"]) { 
      this.setFocusedRow(-1); 
      this.filterText = ""; 

      // if (this.selectedItems.indexOf(row) === -1) { 
      // this.selectedItems.push(row); 
      // for (var i = 0; i < this.filteredItems.length; i++) { 
      //  if (this.filteredItems[i] === row) { 

      //  } 
      // } 
      // } 

      if (this.ngChange) { 
       this.ngChange({ itemSelected: row }); 
      } 

      console.log(this.selectedItems); 

      //we need to make sure the click event of selecting an item in the dropdown stops here 
      //otherwise it will run into the resetInput function below and not show the selected city in the input element when filterText is used 
      $event.preventDefault(); 
      $event.stopPropagation(); 

     } else { 
      this.setFocusedRow(-1); 
      this.filterText = ""; 
      this.ngModel = row; 
      this.ngModelValue = (this.showSelectedItem === false) ? "" : row[this.itemDisplayProperty]; 

      if (this.ngChange) { 
       this.ngChange({ itemSelected: row }); 
      } 

      this.filteredItems = this.items; //reset filteredItems back to initial items 
      this.closeDropdown(); 

      //we need to make sure the click event of selecting an item in the dropdown stops here 
      //otherwise it will run into the resetInput function below and not show the selected city in the input element when filterText is used 
      $event.preventDefault(); 
      $event.stopPropagation(); 
     } 

Ben 'etkin' sınıfına ng-sınıfında halen yapıyorum gibi, eşleşen satırda "aktif" sınıfını (ya da herneyse) ayarlamanız gerekir ancak kullanıcı ctrl tuşunu basılı tutan, ben Ctrl tutulduğu sürece bu aktif sınıfı tüm tr'lere ekleyebilmeli.

My ng-model bu noktada bir dizi değildir ve şu anda yalnızca bir öğeyi seçen kullanıcıya dayanan bir değeri tutar.

Bunu nasıl yapabilirim? Herhangi bir yardım çok takdir edilir.

Answer 1

tr etiketi içinde ng-class'un sonunda bir kapanış etiketini kaçırdınız.

<tr ng-repeat="row in ctrl.filteredItems" ng-class="{'active': ctrl.checkEquality(row, ctrl.ngModel)" ng-mousedown="ctrl.onSelectedLocal(row, $event)">