数据绑定

Previous作用域 Next控制器->模板->控制器->模板

Last updated 6 years ago

Was this helpful?

数据绑定

数据绑定可自动将model和view间的数据同步。
Angular实现数据绑定的方式，可以让我们把model当作程序中唯一可信的数据来源。view始终是model的投影。当model发生变化时，会自动反映到view上。
Angular的 ng 的一大特点，就是数据双向绑定。

经典模板系统中的数据绑定

大多数模板系统中的数据绑定都是单向的
把模板与model合并在一起变成view，如果在合并之后，model发生了变化，不会自动反映到view上。
用户在view上的交互也不会反映到model中，开发者必须写大量代码不断地在view与model之间同步数据。

Anguarjs 模板中的数据绑定

模板是在浏览器中编译的，在编译阶段产生了一个实时更新(live)的视图
不论在model或是view上发生了变化，都会立刻反映到对方。
model成为程序中唯一真实的数据来源，极⼤大地简化了开发者需要处理的编程模型。*

数据双向绑定例子：

<body ng-app>

    <!--
        view => 12131
        model => 12131
        3个 view
        数据是双向绑定的
    -->
    <input type="text" ng-model="name" value=""/>

    <!--angular的表达式-->
    {{ name }}

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

   <script type="text/javascript" src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

</body>

效果：

Previous作用域 Next控制器->模板->控制器->模板

Last updated 6 years ago

Was this helpful?