angularjs - ng-model 和 form inside ng-repeat

Question

我正在为 $scope 中的每个项目创建一个表单。 ng-model 没有链接到我提交的表单上的数据。

<li ng-repeat="item in favourites">
   <form ng-submit="DeleteFavourite()" class="form-horizontal" id="frmSpec">
       <input ng-model="item.Description"/>
       <input ng-model="item.Refno"/>
       <button type="submit"class="btn">{{item.Description}}
           <span class="glyphicon glyphicon-remove"></span>
       </button>
   </form>
</li> 

Answer 1

这个问题与@DavidBeech 的评论密切相关。在 Angular Controller 中，范围被视为层次结构对象。

例如，如果您有以下内容:

<div ng-controller="SomeCtrl">  
<li ng-repeat="item in favourites">
   <form ng-submit="DeleteFavourite()" class="form-horizonatal" id="frmSpec">
       <input  ng-model="item.Description"/>
       <input  ng-model="item.Refno"/>
       <button type="submit"class="btn">{{item.Description}}
           <span class="glyphicon glyphicon-remove"></span>
       </button>
   </form>
</li> 
</div>

当该 Controller 被注入(inject)到 div 中并创建新的范围实例时，它只会看到该级别的内容及其父级的范围。它不知道其子级的作用域。因此，当您调用 DeleteFavourite() 时，因为它是附加到 Controller 范围的方法，所以它不会有 ng repeat 的上下文。因此，正如 David 所说，您需要执行类似 DeleteFavorite(item) 的操作，以便它了解您提交的内容，否则您将不知道您提交的迭代中的项目。

如果您想要示例，请随时发表评论，我可以将 fiddle 与作用域继承示例放在一起。