一尘不染

将ng-model分配给ng-repeat生成的复选框

angularjs

我已经建立了一个json,其中包含ID和国家/地区代码附加的国家/地区列表:

看起来像这样:

$scope.countries = [
  {"name":"Afghanistan","id":"AFG","country-code":"004"},
  {"name":"Åland Islands","id":"ALA","country-code":"248"},
  {"name":"Albania","id":"ALB","country-code":"008"},
  {"name":"Algeria","id":"DZA","country-code":"012"}
]

然后,我使用ng-repeat指令为每个国家/地区创建复选框输入。

<div ng-repeat="country in countries">
      <label><input type="checkbox" ng-model="{{country.id}}" ng-true-value="'{{country.name}}'" ng-false-value="''">{{country.name}}</label>
</div>

但是,当我运行代码时,只能显示以下内容:

此处的位置复选框 {{country.name}}

如果删除ng-model重复部分,我的复选框会很好,但是我需要ng-model在每个复选框上附加一个唯一的

ng-model="{{country.id}}"

我将如何附加一个独特的ng-model价值?

此答案(在ng-repeat内生成ng-mode)未提供唯一ng-model


阅读 272

收藏
2020-07-04

共1个答案

一尘不染

我会建议您 使用:

<div ng-repeat="country in countries">
    <label><input type="checkbox" ng-model="myCountry.selected[country.id]" ng-true-value="'{{country.name}}'" ng-false-value="''">{{country.name}}</label>

</div>

</div>
{{myCountry.selected}}

JS:

$scope.myCountry = {
    selected:{}
};
2020-07-04