Question

我想循环遍历从REST服务接收的对象数组，并使用ng-repeat指令创建动态表单。

这是我的表格，带有评级指令（用于UI Bootstrap库）

<form name="categoryRatingFrom" data-ng-submit="updateCategories(catRatings) >

<div data-ng-repeat="cats in categories" class="form-group clearfix">
  <label class="control-label">{{ cats.name }}</label>
    <div class="no-outline"
          data-rating
          data-ng-model=" // Here I want to concatenate {{ cats.id }} with the ng-model name catRatings // "
          data-max="6"
          data-rating-states="ratingOptions.ratingStates"
          data-on-hover="atmosphereRating.onHover(value)"
          data-on-leave="atmosphereRating.onLeave()"></div>
     </div>
<form>

我想使用我在提交时传递的对象名称设置data-ng-model值，并使用我的循环/数组中的当前对象的ID，但是我似乎无法做到这一点。我应该在控制器中使用循环接收对象数组时进行连接，然后使用ng-repeat中的值设置data-ng-model在提交表单时没有任何内容传递给控制器（请参阅下面的代码）：

// loop through the object adding a ng-model name that we match in our form...
for (var i = 0, l = $scope.categories.length; i < l; i++) {
  $scope.categories[i]['modelId'] = 'catRatings.' + $scope.categories[i].id;
}

我将以下内容添加到我的HTML data-ng-model="cats.modelId"中，但在提交时没有任何内容传递给控制器 - 任何人都可以帮我解决问题或者给我一个答案来解决我的错误吗？

Answer 1

ng-model接受变量，而不是字符串值。我不确定你到底想要做什么，但我认为它会是这样的：

ng-model="catRatings[cats.id]"

但是，我不熟悉该指令，因此我不确定它是否接受ng-model属性。

Answer 2

我创建了an example，将在整个帖子中引用。以下变量在范围内声明如下。

$scope.data = [
  {
    'id' : 0,
    'name' : 'Tim'
  },
  {
    'id' : 1,
    'name' : 'John'
  }
];
$scope.ratings = [ '5 stars', '2 stars' ];

当您将模型设置为'catRatings' + {{ cats.id }}时，这意味着您要声明$scope.catRatings1，$scope.catRatings2等。您应该直接绑定类别对象，如下所示。

<label ng-repeat="person in data">
  <input type="text" ng-model="person.name">
  ...
</label>

或绑定到具有相应索引的数组

<label ng-repeat="person in data">
  ...
  <input type="text" ng-model="ratings[$index]">
</label>

或使用id ...

绑定到数组

<label ng-repeat="person in data">
  ...
  <input type="text" ng-model="ratings[person.id]">
</label>

如何将ng-model值与ng-repeat中的值连接起来

2 个答案: