Question

我在使用angular bootstrap-ui btn-checkbox指令及其与ng-repeat指令的交互方面遇到了一些麻烦。指令的设置方式是您必须为多重复选框方案手动命名每个单独的模型，这在ng-repeat中是不可能的，或者我还没有找到如何实现这一点。

我找到了与此问题有些相似的答案：

Setting and getting bootstrap radio button inside angular repeat loop

并分叉了这个问题，以便更好地解释我所看到的问题。可以查看plunker：

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

Answer 1

您链接的答案与此问题的解决方案相同。重复中的每个按钮都需要它自己的模型独特属性。如果它们都设置为相同的模型，就像在插入$scope.checkboxModel = {id: 0}中一样，当选中一个按钮时，它们都将被检查。

因此，为了给每个按钮唯一性，您可以在ng-repeat内的对象上设置另一个属性。此属性将包含一个在检查时更改的布尔值。所以你的模型看起来像：

$scope.companies = [{"id":2,"name":"A", truthy:false}] // and so on

您不需要在控制器中显式设置它 - 只需在按钮元素的模型中声明新属性：

<companies ng-repeat="company in companies">
    <button type="button" class="btn"  ng-model="company.truthy" 
      btn-checkbox>{{company.name}}</button>
</companies>

Here's the plunk

ng-repeat中的AngularJS Bootstrap UI btn-checkbox

1 个答案: