在上一節我們說到angularJs的controller,我們平時用{{ }}取值是能夠正常取值,但是會出現一定問題,因爲AngularJs是在頁面加載完畢之後進行髒數據檢查,然後更新
所以在網絡出現延遲的情況下我們就會出現頁面剛打開 出現大量類似於{{ name }}的東西,頁面加載完成後,這些又自動更新爲所屬屬性的值;具體我們看下例子如下:
本例子必須啓動服務器進行測試,如果將html拖入
首先,我在引入Angularjs之前先來一個alert(1)的js代碼,大家知道alert會暫停js的代碼執行
<script type="text/javascript">
alert(11);
</script>
<script src="../../angularJs/angular.min.js"></script> -
<script src="../../angularJsDemo/03.ng-bind/controller.js"></script>
然後controller.js中的代碼
var controllerDemo=function($scope){
//申明一個model
$scope.name="小明";
$scope.sex="男";
}
html頁面中的代碼
<div ng-app="">
<div ng-controller="controllerDemo">
<input type="text" ng-model="name" value="">
{{name}}
</div>
</div>
然後我們運行html文件:首先出現的是
點擊確定後,恢復正常
此時,需要解決這類問題,只需要 將 {{name}} 用ng-bind方式進行獲取,改爲<div ng-bind="name"></div>,這裏我是用的div,大家可以根據自己需要進行標籤選擇!修改後則不會出現點擊確定前的情況了