使用angularjs中選中的復選框的值更新數組

Question

我有一個數組如下

var selected = [];

$scope.listA = [
  {
    name : "Sample 1"
  },
  {
    name : "Sample 2"
  },
  {
    name : "Sample 3"
  }
];

輸入的html元素是

<div ng-repeat="label in checkMode()">
    <input type="checkbox" checked> {{ label.name }}</input>
</div>

如何根據選中的復選框獲取所選值的數組？ 例如，我要獲取以下選定的值

var selected = ["sample 1","sample 3"];

也能夠更新陣列。

Answer 1

這是一個簡單的輕量級指令，可以執行此操作

http://vitalets.github.io/checklist-model/

Answer 2

非常簡單

在復選框中添加一鍵式功能，希望它能正常工作... ref link ... jsbin

<div ng-repeat="label in checkMode()">
   <input type="checkbox" checked ng-click="toggleSelection(label.name)> {{ label.name }}</input>
</div>
$scope.listA = {
    name : "Sample 1"
  },
  {
    name : "Sample 2"
  },
  {
    name : "Sample 3"
  }
];

$scope.selected=[];

  $scope.toggleSelection = function toggleSelection(selected) {
    var idx = $scope.selected.indexOf(selected);

    // is currently selected
    if (idx > -1) {
      $scope.selected.splice(idx, 1);
    }

    // is newly selected
    else {
      $scope.selected.push(fruitName);
    }
  };

Answer 3

您可以使用ng-checked來實現

 var app = angular.module('my-app', [], function() {}) app.controller('AppController', function($scope) { $scope.selected = ['Sample 2']; $scope.listA = [{ name: "Sample 1" }, { name: "Sample 2" }, { name: "Sample 3" }]; $scope.toggleChecked = function(item) { var index = $scope.selected.indexOf(item.name); if (index == -1) { $scope.selected.push(item.name); } else { $scope.selected.splice(index, 1); } } }) 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="my-app"> <div ng-controller="AppController"> <div ng-repeat="label in listA"> <input type="checkbox" ng-checked="selected.indexOf(label.name) > -1" ng-click="toggleChecked(label)">{{ label.name }} </div> <pre>{{selected}}</pre> </div> </div>