AngularJS常见问题答疑

AngularJS是动感的JS框架,使用它可以使你的代码变得简单,特别是大型的WebApp,因为你不在去手动的去更新你的UI,你只需要关心你的数据和你应用的状态即可。

下面是一些简单而常用的AngularJS中遇到的一些问题,仅供大家参考:

1s钟回顾

3ddfe882d7eeca6086428e4a721cc1d5.jpg

问题分享

明明改变了数据为什么没有更新?

这种问题可能多半时没有进入AngularJS自己的Context中去,导致无法对视图进行更新,这个时候你可能要手动进行更新

这个你可以尝试使用$apply或者$digest,但也不要过度滥用$digest,每次调用毕竟是要消耗很多的资源的

但有时候调用了会遇到如下的报错:

4ba20dc82d4d396806f46dfd854969f5.jpg

不要着急,在手动调用$digest的时候,使用如下的封装可以做到万无一失

1
2
3
4
5
6
7
8
9
10
var  updateUI =  function (){
     if (! $scope.$$phase){
          $scope.$digest();
     }
};
var  updateRootUI =  function (){
     if (! $rootScope.$$phase){
          $rootScope.$digest();
     }
};

提交的数据多了那么多$$hashKey怎么办

如下的数据

f708395a5ae57bf533766720e82259ff.jpg

原因是因为$$hashKey是AngularJS为了做DirtyCheck加的haskKey,解决这个办法也很简单,请使用angular.toJson发放代替JSON.stringify序列化数据

页面加载为什么会有那么多404?

这个多半是模板里面直接使用了src,请使用ng-src替代src,这里提一下,sodaRender里请使用soda-src

QQ截图20151201110505.jpg

多层循环嵌套$index重复怎么办?

请使用track by 语法(sodaRender也支持)

QQ截图20151201110527.jpg

Directive如何使用ng-model?

自己封装的Directive,想像ng-model一样好用怎么办?

请使用directive中的require配置项,将ng-model Directive引进来,并在合适的时间调用setViewValue方法

QQ截图20151201110605.jpg

ng-model不能满足我怎么办

有些时候,ng-model并不能满足所有的场景需求,这个时候可以考虑使用set、get方法做一层拦截,这样就可以更好的控制数据绑定,如下

QQ截图20151201110640.jpg

然而在1.3+的版本中,angularJS似乎也意识到了ng-model的这一点,所以它开放了API允许我们进行拦截

QQ截图20151201110714.jpg

QQ截图20151201110730.jpg

只不过,AngularJS讲set和get方法合二为一,这一点也是比较巧妙的。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值