<strike id="gsaa8"></strike>

<ul id="gsaa8"></ul>

點擊下載
本文文檔

當(dāng)前位置：首頁 - 科技 - 知識百科 - 正文

AngularJS修改model值時,顯示內(nèi)容不變的實例

來源：懂視網(wǎng) 責(zé)編：小采時間：2020-11-27 22:07:51

AngularJS修改model值時,顯示內(nèi)容不變的實例

AngularJS修改model值時,顯示內(nèi)容不變的實例:一段很簡單的AngularJs代碼： <!DOCTYPE html> <html> <head> <meta charset=utf-8> <script src=http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min

推薦度：

點擊下載本文 文檔為doc格式

導(dǎo)讀AngularJS修改model值時,顯示內(nèi)容不變的實例:一段很簡單的AngularJs代碼： <!DOCTYPE html> <html> <head> <meta charset=utf-8> <script src=http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min

一段很簡單的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)頁上回顯示一個文本框，輸入值，文本框下面會顯示所輸入的內(nèi)容。

簡單修改一下代碼：

<!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>

這次當(dāng)輸入內(nèi)容時，不會顯示輸入信息了，同時AngularJs表達(dá)式也不能被解釋了。

感覺是因為Angular默認(rèn)不存在myApp的對象，所以angular找不到對應(yīng)的應(yīng)用程序。

繼續(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í)行代碼又可以更新輸入內(nèi)容了。

由此可見AngularJs需要一個默認(rèn)的app，當(dāng)默認(rèn)的app不存在的時候，需要對app編寫相應(yīng)的controllar.

以上這篇AngularJS修改model值時,顯示內(nèi)容不變的實例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com