使用AngularJS的表格中的複選框選擇

我想創建一個方法，該方法在檢查複選框時從表格中接收一個Id，並更新角度控制器中的$ scope.selected。並且當複選框未被檢查時，它應該再次從$ scope.selected中移除它。使用AngularJS的表格中的複選框選擇

到目前爲止，它看起來像這樣：

$scope.updateselection = function(id) { 
    if ($scope.selected(sort_id) != id) { //what is the correct syntax here?? 
     $scope.selected.push({ sort_id: id }); 
    } else { 
     $scope.selected.remove({ sort_id: id }); 
    } 
};

來源

2014-09-24 ShaqCode

而問題是？ – 2014-09-24 08:10:17

$ scope.selected（sort_id）！= id（這裏有什麼正確的語法？） – ShaqCode 2014-09-24 08:14:51

對於在角ckeckboxes互動，我建議使用以下指令：http://vitalets.github.io/checklist-model/

如果你不想使用該指令，您可以在複選框表格上創建觀察者。

例如：

HTML：

<table> 
    <tr> 
     <td ng-repeat="item in items"> 
      <input type="checkbox" ng-model="item.value"> 
     </td> 
    </tr> 
<table>

JS：

$scope.items = [ 
     { 
      name: "name1", 
      value: true 
     }, 
     { 
      name: "name2", 
      value: false 
     } 
    ]; 

    $scope.selectedItems = []; 

    $scope.$watch('items', function(newValues){ 
     $scope.selectedItems.length = 0; 
     angular.forEach(newValues, function(item) { 
      if (item.value == true) { 
       $scope.selectedItems.push(item.name); 
      } 
     }); 
     console.log($scope.selectedItems); 
    }, true);

這種方式可以讓你總是有關於選定複選框的實際信息。

我已創建JSFiddle爲您提供工作示例。

來源

2014-09-24 08:21:58

非常感謝！這就像一個魅力！ – ShaqCode 2014-09-24 09:19:20

@ShaqCode，歡迎您;）但是如果您有正確的答案，您可以將其標記爲最好或有用。謝謝。 – 2014-09-24 09:23:55

使用AngularJS的表格中的複選框選擇

回答

相關問題