angularjs – 使用ngRepeat =>不可编辑的输入绑定到图元数组

发布时间：2020-12-17 08:58:08 所属栏目：安全来源：网络整理

导读：这是一个 demo我的问题。 $scope.myNumbers = [10,20,30];div ng-repeat="num in myNumbers" input type="text" ng-model="num" divcurrent scope: {{num}}/div/div 任何人都可以向我解释为什么输入不可编辑/只读？如果是按设计，背后的理由是什么？ UPDATE

这是一个 demo我的问题。

$scope.myNumbers = [10,20,30];

<div ng-repeat="num in myNumbers">
  <input type="text" ng-model="num">
  <div>current scope: {{num}}</div>
</div>

任何人都可以向我解释为什么输入不可编辑/只读？如果是按设计，背后的理由是什么？

UPDATE 2/20/2014

看起来这不再是v1.2.0 Demo的问题。但请记住，虽然用户控件现在可以与较新的angularJS版本编辑，它是num属性在子范围，而不是父范围，得到修改。换句话说，修改用户控件中的值不会影响myNumbers数组。

Can anyone explain to me why are the inputs uneditable/readonly? If it’s by design,what’s the rationale behind?

它是设计，as of Angular 1.0.3. Artem有一个very good explanation的如何1.0.3工作，当你“绑定到每个ng重复项目直接” – 即，

<div ng-repeat="num in myNumbers">
  <input type="text" ng-model="num">

当您的网页最初呈现时，下面是您的范围的图片(我删除了一个数组元素，所以图片将有更少的框)：

(点击放大)

虚线显示了原型范围继承。
灰线表示子→父关系(即$ parent引用什么)。
棕色线条显示$$ nextSibling。
灰色框是原始值。
蓝色框是数组。紫色是对象。

注意，我在你的评论中引用的SO答案是写在1.0.3之前出来。在1.0.3之前，ngRepeat子范围中的num值实际上会在您键入到文本框中时发生变化。 (这些值在父作用域中不可见。)自1.0.3以来，ngRepeat在摘要周期内将parentRepeat作用域num值替换为父/ MainCtrl作用域的myNumbers数组中的(未更改)值。这基本上使输入不可编辑。

修复是使用MainCtrl中的对象数组：

$scope.myNumbers = [ {value: 10},{value: 20} ];

然后绑定到ngRepeat中对象的value属性：

<div ng-repeat="num in myNumbers">
  <input type="text" ng-model="num.value">
  <div>current scope: {{num.value}}</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

angularjs – 使用ngRepeat =&gt;不可编辑的输入绑定到图元数组

angularjs – 使用ngRepeat =>不可编辑的输入绑定到图元数组