有選擇地將'ng-class`應用於一系列項目

Question

我有一個複選框列表。當我點擊它的複選框時，我試圖有條件地向ng-class申請一個類到檢查過的項目。我當前的設置存在的問題是，當我單擊複選框而不是所需的複選框項目時，它將該類應用於全部項目。

我如何正確定位與ng-class而不是所有項目的特定項目？

HTML

<ul class="todos"> 
    <li ng-repeat="todo in todoItems" class="todo"> 
     <input type="checkbox" 
      ng-click="delete($index)" 
      id="todo-{{todo.id}}"/> 
     <span class="todo-title" 
      ng-class="{striked: thisTodoStriked === true}" 
      >{{todo.title}}</span> 
    </li> 
    </ul> 

COFFEE

$scope.thisTodoStriked = false 
$scope.delete = (indexedItem) -> 
    TodoFactory.todos.getList().get(indexedItem).then (item) -> 
     $scope.thisTodoStriked = true 
     console.log 'delete invoked' 

Answer 1

那將是因爲你告訴代碼重拳出擊所有的人。

更好的選擇是將thisTodoStriked添加到該項目。

我不知道的CoffeeScript，但等同的JavaScript：

$scope.delete = function (item){ 
    $scope.todoItems[item].thisTodoStriked = true; 
} 

然後，在你的模板：

<span class="todo-title" 
     ng-class="{striked: todo.thisTodoStriked === true}" 
     >{{todo.title}}</span>