Question

我是AngularJs的新手，因此我对它所提供的所有功能感到好奇。

当我读到关于双向绑定的内容时，我感觉就像在2个文本框上进行实验一样。我将文本输入第一个文本框并在同一类型中我可以看到相同的文本反映在第二个文本框中。我在网上搜索了双向绑定的例子，但只能找到文本框和跨度的例子。

所以有人可以帮助我吗？这就是我试过的

 <html ng-app="myapp">
    <div ng-bind="">
    <input type="text"  ng-model="name" >
    <input type="text" ng-bind="name" >
    </div>
    </html>

以及

 <input type="text"  ng-model="name" >
    <input type="text" ng-value="name" >

和

<input type="text"  ng-model="name" >
<input type="text" ng-value={{name}} >

但似乎没有任何效果。

Answer 1

双向绑定意味着您可以将html页面中的某些值绑定到Angular controller。希望这个Plunker能帮助你理解它

<div ng-controller="mainCtrl">
  Val1: <input type="text"  ng-model="name" name="val1">
  <p>
  Val2: <input type="text"  ng-model="name" name="val2">
</div>

Answer 2

你应该对两个文本框使用ng-model -

<input type="text"  ng-model="name" >
<input type="text" ng-model="name" >

Answer 3

添加@ d-bro82和@Shailendra Singh Deol发布的内容

AngularJs支持MVVM框架，它可以在模型和视图之间自动同步数据。

ng-model指令绑定HTML控件的值，如input，select，textarea。

在键入某些文本的第一个文本框中，它会绑定到模型。

<input type="text"  ng-model="name" >

当您创建具有相同模型的第二个文本框时，它会反映已绑定的值。

<input type="text"  ng-model="name" >

如何使用AngularJs在两个文本框上实现双向绑定？

3 个答案: