AngularJS經驗分享
AngularJS是動感的JS框架,使用它可以使你的代碼變得簡單,特別是大型的WebApp,因為你不在去手動的去更新你的UI,你只需要關心你的數據和你應用的狀態即可。
下面是一些簡單而常用的AngularJS中遇到的一些問題,僅供大家參考
1s鐘回顧
問題分享
明明改變了數據為什么沒有更新?
這種問題可能多半時沒有進入AngularJS自己的Context中去,導致無法對視圖進行更新,這個時候你可能要手動進行更新
這個你可以嘗試使用$apply或者$digest,但也不要過度濫用$digest,每次調用畢竟是要消耗很多的資源的
但有時候調用了會遇到如下的報錯
不要著急,在手動調用$digest的時候,使用如下的封裝可以做到萬無一失
varupdateUI=function(){ if(!$scope.$$phase){ $scope.$digest(); } }; varupdateRootUI=function(){ if(!$rootScope.$$phase){ $rootScope.$digest(); } };
提交的數據多了那么多$$hashKey怎么辦
如下的數據
原因是因為$$hashKey是AngularJS為了做DirtyCheck加的haskKey,解決這個辦法也很簡單,請使用angular.toJson發放代替JSON.stringify序列化數據
頁面加載為什么會有那么多404?
這個多半是模板里面直接使用了src,請使用ng-src替代src,這里提一下,sodaRender里請使用soda-src
<imgng-src="{{url}}.png"/>
多層循環嵌套$index重復怎么辦?
請使用track by 語法(sodaRender也支持)
<ling-repeat="item in list track by $subindex"> </li>
Directive如何使用ng-model?
自己封裝的Directive,想像ng-model一樣好用怎么辦?
請使用directive中的require配置項,將ng-model Directive引進來,并在合適的時間調用setViewValue方法

ng-model不能滿足我怎么辦
有些時候,ng-model并不能滿足所有的場景需求,這個時候可以考慮使用set、get方法做一層攔截,這樣就可以更好的控制數據綁定,如下
然而在1.3+的版本中,angularJS似乎也意識到了ng-model的這一點,所以它開放了API允許我們進行攔截
只不過,angularJS講set和get方法合二為一,這一點也是比較巧妙的