angularjs - 使用节点在Angularjs中保存复选框列表

Question

我想使用带有节点后端的angularjs中的绑定(bind)来保存和加载复选框列表。这个 SO 问题 (How do I bind to list of checkbox values with AngularJS?) 回答了如何从静态 javascript 对象加载复选框，但如何在用户选择复选框值后保存它们？

我想将复选框值保存在单个字段中，但是如何告诉 Angular 将复选框值绑定(bind)到模型中定义的单个字段到我的 mongodb 中？我不能只使用 ng-model，因为有多个复选框。

不用说，我是 Angular 的新手，所以非常感谢这里的任何帮助......

感谢您的任何帮助，您可以提供。

克苏多

Answer 1

只需添加 ng-model到您的复选框。通过这种方式，您可以在任何复选框状态更改时更新 Controller 中的模型。

这是示例:

HTML

<div ng-controller="Ctrl">
    <label ng-repeat="fruit in fruits">
  <input
    type="checkbox"
    name="fruit.name"
   ng-model="fruit.value"
  > {{fruit.name}}
</label>
    <pre>{{fruits| json}}</pre>    
</div>

JS

var app = angular.module('app', []);
function Ctrl($scope) {
    $scope.fruits = [{
        name: 'apple',
        value: false
    }, {
        name: 'orange',
        value: false
    }, {
        name: 'pear',
        value: false
    }, {
        name: 'naartjie',
        value: false
    }];
}

演示 Fiddle

[编辑]

顺便说一句，我们可以使用 angular.copy() 制作副本方法。当我们按下按钮时， fruits 的新副本将创建模型(您应该将其作为 json 发送到服务器)。老款 fruits将保持不变:

$scope.fruitsCopy = [];

 $scope.init = function(){
  $scope.fruitsCopy = angular.copy($scope.fruits );
}

要将数据转换为 JSON，我将使用:

var jsonData = JSON.stringify($scope.fruitsCopy);

演示2 Fiddle