《后台系统》由会员分享，可在线阅读，更多相关《后台系统（9页珍藏版）》请在金锄头文库上搜索。
1、Angularjs技术交流,angularjs中的几个概念 新建一个后台系统,1.1 angularjs中的MV*，如图：,a.mvc-v： 例：一段简单的程序 请输入姓名： 输入的内容是：name 或者 msg (事先引入angularjs的库文件，如此ng指令才会有效),b.mvc-c： / 定义一个模块 var myModule = angular.module(“myapp“,); /定义一个控制器 myModule .controller(“MyCtrl“,function($scope) $scope.msg=“hello angular！“; ); 模块的名称和controlle
2、r的名称应该是html代码中的ng-app和ng-controller的名称保持一致,ng-app=“myapp“，这个是程序的入口（等价于main()方法），也是ng指令的作用域，表明范围内所有标签归angular.js来管理，不在这个范围中的angular指令将不生效，注意一个程序中只有一个 ng-app； name，双括号是赋值属性，是全局对象$scope的属性； ng-model 指令把输入域的值绑定到应用程序变量 name； ng-bind 指令把应用程序变量 name 绑定到某个段落的 innerHTML； ng-controller=“MyCtrl“,是MVC中的C(contro
3、ller)控制器，是控制下面的元素依据什么来显示； MV模型：拥有ng-model=“name“属性的input输入的值将作为M，而使用name指令的span就是V，当输入框输入值有变化时，V中内容也随着数据模型的值变化。这里的 V 和 M 通过ng-model=“name“ 和name进行关联。 MVC模型： 在div中，通过ng-controller=“MyCtrl“绑定一个名为MyCtrl的控制器，在p标签中使用msg将数据取出并展示； 在script代码中：angular.module(“myapp“,)创建了一个模块，这里的myapp对应，声明作用范围，而可填入其他具体的模块。$sc
4、ope是M,这里的V(div)通过ng-controller=“MyCtrl“绑定了控制器MyCtrl，然后通过msg将控制器中数据取出并展示。而C（MyCtrl）通过操作M（$scope），为V层提供M的数据。可以说C是为了实现V和M之间的数据交互而存在的。,路由-模块-依赖注入： ng中模块切分 (1)用一个总的app模块(spConfig)作为入口点，它依赖其他所有模块(eg:spConfigControllers)， (2)控制器、指令、服务、路由、过滤器分别放在一个模块里面 (ngRoute,spConfigControllers,spConfigDirectives,spConfi
5、gServices,spConfigFilters)； (3)使用ngRoute进行视图之间的路由(app.config.js)； (4)模块之间的依赖通过依赖注入机制来完成。,1.2 angularjs适用范围和优劣势 （1）优势： AngularJS是javascript的一个框架，是为了克服HTML在构建应用上的不足而设计的，它最独特最有创造性的特性是双向数据绑定和HTML扩展能力，它通过指令让浏览器能够识别新的语法。 Angular能够帮助我们有条不紊地把程序生成区块进行分类：控制器(controllers)，指令(ng)，装配器(directives)，筛选器(filters，服务(
6、services)和视图(templates)等。这些都是以模块化方式进行组织的，互相形成依赖。不同区块有不同的角色，视图负责UI，控制器负责UI身后的逻辑管理，指令负责组件复用以及HTML扩展等。 例如： 使用双大括号语法进行双向数据绑定(ng-model,ng-bind)；(优于其他框架) 使用DOM控制结构来实现迭代(ng-repeat)或者隐藏DOM片段(ng-if,ng-show)； 支持表单和表单的验证； 能将逻辑代码关联到相关的DOM元素上(ng-controller)； 能将HTML分组成可重用的组件 自动化的脏数据检查(Dirty Checking)机制能够使我们进行任意的对
7、象属性修改，angular会自动识别出这些变更，然后通知所有与该属性有关的观察者。 （2）不足： 重量级的框架，性能不如react，Backbone轻量级的框架，适用于后台开发的前端框架。不适合类型开发：内容网站，交互频繁的（如游戏之类交互体验网站），太过于简单的页面。 （3）对比其他框架： React就是为了解决其他JavaScript框架都未能解决的一个问题-高效地渲染大型数据集，它采用了虚拟文档对象模型(DOM)和拼接机制，每一次对网页做了更改后，React就只更新与更改相关的部分，而不需要重新对整个站点进行渲染，react的优势是渲染速度和可维护性，但是要配合redux，flux等框架使用，写起来比较繁琐，而且没有控制器； 相比之下angular开发效率要高一些，后台应用表单较多，angular处理比较方便。,THANKS,
