angularjs 在 ng-repeat 指令中预填充输入文本

Posted 2023-03-05

【中文标题】angularjs 在 ng-repeat 指令中预填充输入文本

【英文标题】：angularjs Prepopulate input text inside ng-repeat directive

【发布时间】：2014-09-28 14:51:12

【问题描述】：

我们有输入文本以预填充值显示。我们正在使用使用 ng-repeat 指令的列表

 <ul ng-repeat="post in postList>
   <input type="text" ng-model="postid" nginit="postid='post.id'"></input>
 </ul>

这个问题AngularJS - Value attribute on an input text box is ignored when there is a ng-model used? 告诉如何预填充输入文本。 但不知何故，我们发现使用内部动态列表很困难。 我们可以这样做还是有更好的方法？

当我们编写这段代码时，我们在文本框中没有得到任何值，而是在 chrome 的开发者控制台的元素选项卡中签入；我们可以看到值正在更新，但不在文本框中。

【问题讨论】：

数据属于模型，为什么要在应该预填充模型时预填充控件？

与您的问题无关，但 ul 的唯一有效子元素是 li。

@Dalorzo 你能解释一下我们做错了什么以及我们应该如何纠正它？

数据属于model，就像接受的答案建议您应该绑定、预填充并在postList 上进行所有数据管理，而不是在您的html 视图或HTML 中的控件中

【参考方案1】：

为什么不直接绑定到 post.id 呢？如果它有一个值，它会将它绑定到文本框的 value 属性。

另外，请确保您使用正确的标记（输入标签）和正确的指令（ng-init）。而且我很确定不想重复 ul 标签，而是其中的项目。

<ul>
    <li ng-repeat="post in postList">
        <input type="text" ng-model="post.id"></input>
    </li>
</ul>

【讨论】：

这解决了我的问题...也感谢您指出错误。