一段很簡單的AngularJs代碼:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> </head><body ng-app=""> <input type="text" ng-model="name"><br /> <span>{{name}}</span> </body></html>網(wǎng)頁上回顯示一個文本框,輸入值,文本框下面會顯示所輸入的內容。
簡單修改一下代碼:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> </head><body ng-app="myApp"> <input type="text" ng-model="name"><br /> <span>{{name}}</span> </body></html>這次當輸入內容時,不會顯示輸入信息了,同時AngularJs表達式也不能被解釋了。
感覺是因為Angular默認不存在myApp的對象,所以angular找不到對應的應用程序。
繼續(xù)修改代碼,為myApp重寫controllar:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> </head><body ng-app="myApp" ng-controller="myCtrl"> <input type="text" ng-model="name"><br /> <span>{{name}}</span> <script> var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.name = "John Doe"; }); </script></body></html>這次執(zhí)行代碼又可以更新輸入內容了。
由此可見AngularJs需要一個默認的app,當默認的app不存在的時候,需要對app編寫相應的controllar.
以上這篇AngularJS修改model值時,顯示內容不變的實例就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網(wǎng)。
新聞熱點
疑難解答