ngRepeat 和复选框

Question

我有一个 div 和 ng-repeat:

<div ng-repeat="fruit in fruits">
  <input type="checkbox" ng-model="this.value" ng-checked="false">{{fruit.code}} - {{fruit.short_name}}
</div>

这里的furits是数组对象，包含字段代码，short_name。

furits: {
         {
          code : code_value1,
          short_name :short_name_value1
         },
         {
          code : code_value2,
          short_name :short_name_value2
         },...
         {
          code : code_value..,
          short_name :short_name_value..
         },
       }

我想在单击提交按钮并将这些代码插入新数组后获取选中复选框的代码。

并将相同的数组发送到服务器以完成任务。

请帮我解决这个问题。

Answer 1

<div ng-repeat="fruit in fruits">
  <input type="checkbox" ng-model="fruit.isChecked" />{{fruit.code}} - {{fruit.short_name}}
</div>
<input type="button" ng-click="save()" value="SAVE" />

在你的控制器里面：

$scope.save = function(){
    var myFruits = [];
    for(i = 0; i < $scope.fruits.length; ++i){
        if ($scope.fruits[i]. isChecked)
            myFruits.push(fruit.code);
    }
}

Answer 2

<div ng-repeat="fruit in fruits">
  <input type="checkbox" ng-model="fruit.isSelected" />{{fruit.code}} - {{fruit.short_name}}
</div>
<input type="button" ng-click="sendServer()" value="Submit" />

你的控制器方法就像，

 $scope.sendServer = function(){
  $scope.checkedFruits = [];
  for(i = 0; i < $scope.fruits.length; ++i){
    if ($scope.fruits[i].isSelected)
        $scope.checkedFruits.push(fruit.code);
  }
  $scope.postData();
 }

//Send array to server via web service with parameter FruitsCode

 $scope.postData = function () {
   $http.post('http://your.webservice/', {FruitsCode:$scope.checkedFruits}).success(
    function(data){
        $scope.response = data
    })

}

希望对您有所帮助！

ngRepeat 和复选框

ngRepeat and checkbox

checkbox

angularjs

ng-repeat