发表于: 2017-05-24 23:01:52
1 889
今天完成的事情:
1、完成退出登录的功能,并且退出后不能通过后退按钮来回到上一个页面。
2、准备小课堂,关于angular的依赖注入。
3、完成侧边栏在刷新之后依然能保持展开的状态,不过一旦失去焦点还是会收缩进去,暂时还没有想到比较好的方法。
明天计划的事情:
1、准备小课堂PPT。
2、完善任务6-10。准备任务6-10的demo。
遇到的问题:
1、在对一个页面重复刷新时,有时候会出现控制器未被注册的错误。后来通过查找资料发现是angular.module的写法不同导致的。以前从来没有注意过。
angular.module('name', [])
和angular.module('name')
虽然看起来很相似,但是!它们的含义却是截然不同的!angular.module('name', [])
是创建一个新的module,[]
表示它没有依赖任何其他模块,如果已经有了一个同名模块,则会覆盖现有的。而
angular.module('name')
是查找一个现有module,如果这个module不存在,则返回空值。如果把带方括号的形式(创建)误用为不带方括号的形式(引用),那么在它的返回值上调用controller等函数会出现空指针错误。而如果把引用形式误用为创建形式,则会导致难以理解的“对象不存在”错误,但是你却明明定义过那个service或者controller等对象!这种问题就是因为后面的模块定义覆盖了以前的模块定义,你定义过的那些对象都被随着以前的module而丢掉了!
2、由于采用bootstrap完成侧边栏的书写,二级菜单一旦失去焦点还是会收缩进去,暂时还没有想到比较好的方法。
收获:
1、了解了
angular.module('name', [])
和angular.module('name')
的区别。在问题中2、angualr依赖注入有三种方式,(数组标注、添加$inject属性、隐式声明)。
数组标注
优先考虑用该方式为组件定义依赖,例如:
someModule.controller('MyController', ['$scope', 'greeter', function($scope, greeter) { // ... }]);
在代码中通过在第二个数组类型的参数中声明了'$scope','greeter'等依赖,数组最后一个元素为实际的构造方法,注意在构造方法的参数列表与其面的数组元素是一一对应的。
$inject属性
我们还可以通过为控制器的构造方法添加$inject属性,并在该属性中添加依赖的方式定义依赖。
var MyController = function($scope, greeter) { // ...} MyController.$inject = ['$scope', 'greeter']; someModule.controller('MyController', MyController);
注意$inject中依赖的顺序与构造方法中的参数需保持一致。
隐式声明依赖
最简单的声明依赖的方式就是让设构造方法的参数与依赖的名字一样。
someModule.controller('MyController', function($scope, greeter) { // ... });
其中前两种在代码minify时不会被破坏,推荐使用第一种方式。
第二种方式可以自己手动改写,也可以使用工具ngAnnotate对隐式声明进行统一改写。
第三种方式,书写最为简单明了,但是不能对它直接进行minify,需要改写为前两种。
评论