04-指令ng-model

AngularJS双向绑定示例

最新推荐文章于 2024-10-24 18:03:52 发布

原创最新推荐文章于 2024-10-24 18:03:52 发布 · 263 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#angularjs

angularJS 专栏收录该内容

35 篇文章

订阅专栏

本文介绍AngularJS中ng-model指令的基本用法，通过一个简单的示例展示了如何实现数据从Model到View的双向绑定。该示例使用了ng-init指令初始化数据，并通过ng-model将其绑定到View上的显示。

<!-- ng-model是用于表单元素的，支持双向绑定。对普通元素无效
双向绑定
数据从model流向view
数据从view流向model

下边展示的例子是数据从model流向view
<div ng-init="name='james'"></div> 是model,
也可以使用$scope.name='james'这种方式来定义model的数据
<p ng-model="name"></p>是view
至于数据从view流向model，暂时没有，以后会有例子
-->
<!DOCTYPE html>
<html lang="en" ng-app="">
    <head>
        <meta charset="utf-8">
        <script src="js/angular.js"></script>
    </head>
    <body>
        <div ng-init="name='james'"></div>
        <p ng-model="name"></p>
    </body>
</html>