Question

我已经徘徊了两到三个小时，我找到了一些相关的问题，但我的情景只是略微曲线。我必须生成一些checkboxes，显然会通过ng-repeat生成。如何显示我从Api获得的预选值。这是我收到的数据类型。

预选数据

$scope.categoriess = [{"id":1,"name":"Garden Cleaning"},{"id":3,"name":"Home Cleaning"}].

这是我使用ng-repeat的数据。

ng-repeat data

$scope.categories = [{"id":1,"name":"Garden Cleaning"},{"id":2,"name":"Gutter Cleaning"},{"id":3,"name":"Home Cleaning"},{"id":4,"name":"Pool Cleaning"}

HTML

  <div ng-repeat="cats in categories">
      <input type="checkbox" ng-model="categoriess.id[cats.id]">
               <label>{{cats.name}}</label>
                  </div>

现在我如何告诉ng-repeat检查预选数据，如果我想再检查几个方框，也应该检查它们，我希望它们存储在$scope.categoriess中。我使用ng-checked尝试了许多解决方案，或者在ng-checked中进行函数调用我没有预期的结果。

Answer 1

为什么不将您的数据格式化为另一个属性，例如

{"id":1,"name":"Garden Cleaning", "checked": true}

这样，当您遍历数据时，您可以选中复选框

<div ng-repeat="cats in categories">
  <input type="checkbox" ng-checked="cats.checked">
  <label>{{cats.name}}</label>
</div>

Answer 2

我看到了这个，但我不知道它是如何工作的，上帝拯救了我的生命。见checklist-model。它非常简单，无需使用ng-checked或动态，预选并轻松更新

[1]: http://jsfiddle.net/iem_usman/v3k6pwrj/1/

Answer 3

像这样更改你的HTML：

<div ng-repeat="cats in categories">
   <input type="checkbox" ng-model="categoriess.id[cats.id]" ng-checked="isChecked(cats.id);">
   <label>{{cats.name}}</label>
</div>

在您的控制器中添加此功能：

$scope.selectedCategoriess = [{"id":1,"name":"Garden Cleaning"},{"id":3,"name":"Home Cleaning"}].

$scope.isChecked = function(id){
for (var i = 0; i < $scope.selectedCategoriess.length; i++) {
    if ($scope.selectedCategoriess[i].id == id) {
        return true;
    }
}
return false;
}

如果ID可用，则选中的值为＆＃34; true＆＃34;。

Angular Js-有没有办法生成动态复选框，也是预选的？

3 个答案: