发表于: 2017-01-23 03:12:14

2 1293


今天完成的事情:

萝卜多后台认证、冻结、删除;

指令这一块一直没用,这两天回炉了,把指令认真看了一轮;


一直都把所有东西都写controller,做前台开始有意识的把service和filter以及constant分开,但是指令这一块却一直是软肋,不知所以然,做到后台可重用的东西比较多,把能复用的内容用指令封装、调用可以缩减篇幅,提高效率,逻辑也容易理出来,分页,搜索条件、模拟弹窗这些都可以写成directive,留出数据接口,调用时只需要填入数据。


萝卜多后台登录;


小课堂分享:AngularJS有哪些优点与缺点

1 良好的应用程序结构  

2 双向数据绑定

3 指令

4 HTML 模板

5.依赖注入


1.性能

2. Angular 2.0推翻重做使得目前不宜采用此框架

3.学习成本高



明天计划的事情:

萝卜多后台;


遇到的问题:

directive实践从简单的封装模板开始,到继承scope,再到隔离scope,期间碰到不少问题,特别是隔离scope,由于简单的过了一下博客的内容,就上手写代码,在directive和父scope进行数据交互的时候吃了很多亏,浪费不少时间,

1.指令作用域中的@

作用是把当前属性作为字符串传递。

2.指令作用域中的=

 作用是与父scope中的属性进行双向绑定。控制器与指令在各自作用域内能够影响对方,也就是双向通信

3.指令作用域中的&

主要作用是传递一个来自父scope的函数,稍后调用。


以上三种方法都以属性为中介链接父scope和directive,属性值为父scope的对象、变量等,directive则通过属性名建立与父scope对象的联系;

scope中使用驼峰写法(testData:‘=’),属性中用-连接(test-data=“”);

若directive中scope的变量名和属性名一样,则可简写为‘=’,如代码中title、reload、listData等;

directive中scope的变量名和属性名不一样,则可写为  变量名:‘=属性名’的形式,如代码中的testData;


scope:{
   templateUrl:'=',
   title:'=',
   listData:'=',

   reload:'&',

   testData:'=abc'

},

title="vm.title"  template-url='vm.templateUrl' list-data="vm.companyList" ng-model="vm.choose" reload="getCompanyList()" abc="obj"


一般只需把逻辑和dom操作放link中,在需要与其他directive、controller进行交互时使用controller;

执行顺序:先controller后link;


何时使用controller:一般场景下都不想要使用controller,只需要把逻辑写在link中就可以了;用controller的场景就是该指令(假设为a)会被其他指令(假设为b)require的时候,这样就会在b指令的link函数中传入这个controller(如果require多个的话,传入的是一个数组,数组中存放的是每一个require的指令对应的controller),目的很显然是为了指令间进行交流的。


对于一个特定的drective, controller可以是没有的, link比较复杂,基本上可以看做是$compile的一个回调 angularjs 对于drictive 必须是首先编译 ---> 调用$compile生成dom对象---> 调用link绑定到相应scope ---> 触发 $digest;

总之 compile, link 之类都是针对driective来说的;


link 是用来把directive嵌入dom的angularjs提供的一个切面机制, controller 是 scope中watch的事件被触发时的context, 完全不同的东西。

一般来说 

1) 把业务逻辑写在controller里, 而且不要写在driective自己的controller里, 而是在它绑定的scope的那个controller上

2) controller里面别出现dom操作,特别是prepend,append 这些, 因为未被编译过的dom对象是没法被watch的, angularjs不会监视那些后来加入又没有被编译过的dom对象。


感觉要延期啊

收获:

如上


返回列表 返回列表
评论

    分享到