一段很简单的AngularJs代码：
<!DOCTYPE html>
<html>
<head>
< charset="utf-8">
< src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></ >
</head>
<body ng-app="">
<input type="text" ng-model="name"><br />
<span>{{name}}</span>
</body>
</html>
网页上回显示一个文本框，输入值，文本框下面会显示所输入的内容。
简单修改一下代码：
<!DOCTYPE html>
<html>
<head>
< charset="utf-8">
< src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></ >
</head>
<body ng-app="myApp">
<input type="text" ng-model="name"><br />
<span>{{name}}</span>
</body>
</html>
这次当输入内容时，不会显示输入信息了，同时AngularJs表达式也不能被解释了。
感觉是因为Angular默认不存在myApp的对象，所以angular找不到对应的应用程序。
继续修改代码，为myApp重写controllar：
<!DOCTYPE html>
<html>
<head>
< charset="utf-8">
< src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></ >
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<input type="text" ng-model="name"><br />
<span>{{name}}</span>
< >
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.name = "John Doe";
});
</ >
</body>
</html>
这次执行代码又可以更新输入内容了。
由此可见AngularJs需要一个默认的app，当默认的app不存在的时候，需要对app编写相应的controllar.
以上这篇AngularJS修改model值时,显示内容不变的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
继续阅读与本文标签相同的文章
上一篇 :
Windows 10正在添加SwiftKey
下一篇 :
mpvue中使用flyjs全局拦截的实现代码
-
【Java类初始化死锁】记一次Cassandra死锁问题排查
2026-05-18栏目： 教程
-
搭建自己的技术博客系列（一）使用 hexo 搭建一个精美的静态博客
2026-05-18栏目： 教程
-
搭建自己的技术博客系列（二）把 Hexo 博客部署到 GitHub 上
2026-05-18栏目： 教程
-
CMU 15-721 14-数据库调度 Scheduling
2026-05-18栏目： 教程
-
从校招生到核心架构师，支付宝研究员李俊奎谈如何成为一名优秀的程序员
2026-05-18栏目： 教程