angularjs - 输入中的角度值绑定到模型变量

Question

我需要帮助在我的代码中发现问题。Angular.js 为我将输入值与ng-model绑定，这不是我想要的。我有一个带有 ng-include 的角度中继器，如下所示：

<div ng-repeat='item in items'>
  <label>{{item.number}}</label>
  <div ng-include='item.template'></div>
</div>

包含的项目模板是一个简单的输入字段，基于 item.template。有问题的标签是 <textarea> 和 <input> 对我来说。

即我包括这个：

<input type="text" ng-model="item.number" />

该项目看起来像：

{
  number: 1
  , template: 'text'
  , text: 'Some text'
  , value: 'Some value'
}

所以当上面的东西渲染时，我得到

<input type="text" ng-model="item.number" class="ng-scope ng-pristine ng-valid">

但问题是，在我的输入字段中，我将项目编号作为值，如果我更改值，我的标签也会更改。即使我输入value=""或placeholder="blah"，我仍然会得到这种行为。

我还没有走那么远，但我想模型也用数字更新了。

我在那里做错了什么？

score 4 · Accepted Answer

Angular 在使用时会在模型和输入元素之间创建双向绑定ng-model。对模型的任何更改都会更新输入元素（所有绑定的默认行为），并且在 UI 输入元素中所做的任何更改都会更新模型。

要摆脱这种行为，您可以

<input type="text" value='{{item.number}}' class="ng-scope ng-pristine ng-valid">

score 1 · Accepted Answer

显然，{{item.number}} 绑定到您的项目对象（双向绑定 FTW！:-)）。如果您希望在渲染时设置该标签并保持不变，那么在您的控制器中，您应该在每个名为“originalNumber”的项目中创建另一个字段，并将您的标签绑定到该字段。

2 回答 2