• 技术文章 >Web开发 >JavaScript

    angularjs双向绑定原理是什么?

    宋雪维宋雪维2020-12-21 15:32:52原创3051

    AngularJS因是为开发者呈现一个更高层次的抽象来简化应用的开发而得到很多人的喜爱。它的数据驱动很有意思,AngularJS数据驱动是由双向绑定完成的。所谓的双向绑定,无非是从界面的操作能实时反映到数据,数据的变更能实时展现到界面。本文主要介绍angularjs双向绑定原理。

    一、AngularJS的工作原理:

    1、ngularJS启动,搜寻所有的指令(directive);

    2、到ng-app,搜寻其指定的模块(Module),并将其附加到ng-app所在的组件上;

    3、nguarJS遍历所有的子组件,查找指令和bind命令;

    4、发现ng-controller或者ng-repeart,创建一个作用域(scope);

    5、添加对变量的监听器,并监控每个变量的当前值。

    二、实例代码

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 <script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script> 7 </head> 8 <body> 9 <div ng-app="myApp" ng-controller="myCtrl"> 10 名: <input type="text" ng-model="firstName"><br> 11 姓: <input type="text" ng-model="lastName"><br> 12 <br> 13 姓名: {{firstName + " " + lastName}} 14 </div> 15 </body> 16 <script> 17 var app = angular.module('myApp', []); 18 app.controller('myCtrl', function($scope) { 19 $scope.firstName = "王"; 20 $scope.lastName = "二狗"; 21 }); 22 </script> 23 </html>

    以上就是python中angularjs双向绑定原理,希望能对你有所帮助哦~

    专题推荐:angularjs向绑定原理
    品易云
    上一篇:JavaScript框架之AngularJS是什么? 下一篇:js数组去重的方法有哪些?

    相关文章推荐

    • json常用解析工具有哪些?• json解析字符串• gson解析json数据的方法

    全部评论我要评论

    © 2021 Python学习网 苏ICP备2021003149号-1

  • 取消发布评论
  • 

    Python学习网