angularJS开发的注意事项汇总
作为一个coder,应该具有经常总结反思的习惯,如果不能及时总结,可能就会忘记自己踩过的很多坑,然后会导致同一个坑踩很多次,所以我打算把这些都记录下来,以方便是对自己的重复记忆,避免无效的coding,另一方面可以希望可以给遇到相似问题的同僚们一些收获. 1.手动触发脏检查在开发过程中,我们可能经常会通过js来手动更改绑定的相关数据,而不是通过dom操作来改变绑定的相关数据,这样也很多情况下会导致绑定数据的视图不能够及时更新,这个时候就需要我们手动触发一下脏检查,下面我就介绍一下三种手动触发脏检查的方法. (1) $aplly() 方法 2.ng-model-options 指令这个指令在表单校验的时候非常有用,我们可以设置什么时候出发试图更新,这样你就可以设置dom元素失去焦点改变后调用监听,从而显示校验的提示. <input>,<select>,<textarea>,这些元素支持该指令 <input ng-model="name" ng-model-options="{updateOn: 'blur'}"> //使用示例 //可配置参数 3. 告别令人尴尬的 {{}}我们都知道,当页面还未加载完毕的时候会出现{{ xxx }}这种尴尬的情况,通过使用ng-bind-template指令,就可以避免尴尬情况的出现. <p ng-bind-template="{{name}}"></p> //使用示例 4.解决ng-if,ng-show,ng-hide偶然出现的闪现的问题(1) 将html片段抽出,通过指令引入ng-include,ng-bind-html 4.控制器之间的通讯问题(1)路由传参 //传递 $state.go(path,{name:"dfdd"}) ui-sref=path({name:"dfdd"}) //获取 $scope.$stateParams.name (2)通过广播 (3)定义全局变量(window) (4) 缓存 以上方法个人比较推荐路由传参的方式 5.$destroy的使用是必要的(1)页面离开时清除页面的定时器 var destroyWatcher = $scope.$watch(...); //示例代码 //$watch方法会返回一个函数,这个函数用来销毁监听器,我们用一个变量承接这个函数,然后再destory的时候调用这个函数就可以销毁不必要的监听器了. $scope.$on("$destroy",function() { if (timer) { $timeout.cancel(timer); } $scope.popover.remove(); destroyWatcher(); } 就先写到这儿了,后面会持续更新... (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |