AngularJS：使用 ng-repeat 生成复选框

Question

我得到了一个我理解的代码，但一小部分不清楚。所以请帮助我理解。

<div ng-controller="MainCtrl">
  <label ng-repeat="(color,enabled) in colors">
      <input type="checkbox" ng-model="colors[color]" /> {{color}} 
  </label>
  <p>colors: {{colors}}</p>

<script>
  var app = angular.module('plunker', []);

  app.controller('MainCtrl', function($scope){
      $scope.colors = {Blue: true, Orange: true};
  });
</script>

http://plnkr.co/edit/U4VD61?p=preview

看到这一行ng-model="colors[color]"这一行如何自动设置复选框选中或未选中状态，因为在代码中我们没有提到checked = true or false然后角度如何自动从模型中提取真或假并将其设置在复选框中...... .这不清楚。请指导我。

Answer 1

如果ng-model 的值为true，角度ng-model 会选中复选框。您已将Blue 指定为true。所以ng-model 选中复选框。

如果您使用 angular ng-model，它将自动填充任何表单字段的值。您不需要输入ng-checked = true 或其他内容

How to check if any Checkbox is checked in Angular

https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D