数据绑定到复选框内的ng-model

时间:2015-06-03 21:38:33

标签: javascript angularjs checkbox

我的问题是我正试图从控制器内部访问这些复选框,所以我可以从那里将它们设置为true。

出于某种原因,我无法找出用于这些复选框的正确ng模型,这样我就能够这样做,同时保持每个模型都有一个唯一的名称。

       <accordion-group ng-repeat="group in groups">
        <accordion-heading>{{group.title}}</accordion-heading>
        <div ng-repeat="collection in group.collections">
          <div class="checkbox collection-legend" style="background-color: {{collection.color}}">
            <label><input type="checkbox" ng-click="toggleCollection(collection.key)" ng-model="checkboxes[collection.key]"> {{collection.name}}: <em>{{collection.description}}</em></label>
            <div class="customFields">
              <label ng-repeat="(key, val) in collection.queries" ng-if="key != 'default' && key != 'dateRangeKey'">
              <input class="form-text" ng-model="customProperties[collection.name + '-' + key]" type="text"><em>{{key}}</em></label>
            </div>
          </div>
        </div>
      </accordion-group>

对于某些上下文,我正在尝试设置一个“恢复会话”方法,用户可以在不必再次填写的情况下恢复提交的旧表单,因此我有需要的复选框列表“重新检查”,我只是想不出如何命名我的模型,所以我可以做到。

ng-model =“checkboxes [collection.key]”似乎应该在这里工作。有什么建议吗?

然后控制器中的$ scope.checkboxes [key] = true。 (关键字匹配collection.key;我已经证实了这一点)。获取“无法设置(键)未定义”错误。

这是JS:

    $scope.session.collections.forEach(function(c){
      $scope.toggleCollection(c);
      console.log(c + ' '+ typeof c);
      $scope.checkboxes = {
        c: true
      };
    });

解决方案:从未将$ scope.checkboxes初始化为空对象。立即行动。

1 个答案:

答案 0 :(得分:0)

您粘贴的代码肯定有效,我在此验证过: https://jsfiddle.net/ho8art1t/

复选框应该是这样的:

$scope.checkboxes = {
    a: true,
    b: false,
    c: true
};

你应该粘贴随附的JS,或者只是检查你的对象是否与那个小提琴一样放置。