NG-点击不更新模型 [英] ng-click does not update model
本文介绍了NG-点击不更新模型的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我用AngularJS测试页一个刷新链接，调用一个函数，其中，作为回报，更新模型customer.name
不过，刷新单击仍然没有改变{{customer.name}}在视图中，我不明白为什么。
下面是我的应用程序的内容。
的index.html
＆LT;！DOCTYPE HTML＆GT;
＆LT; HEAD＆GT;
＆LT;标题＆GT;测试与LT; /标题＆GT;
＆LT; /头＆GT;
＆LT;机身NG-应用=roaMobileNgApp＆GT;
＆LT;脚本SRC =脚本/ angular.js＆GT;＆LT; / SCRIPT＆GT; ＆LT;脚本SRC =脚本/角ui.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;链接rel =stylesheet属性HREF =脚本/角ui.css＆GT; ＆LT; DIV CLASS =容器NG-视图=＆GT;＆LT; / DIV＆GT; ＆LT;脚本SRC =脚本/ app.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本SRC =脚本/控制器/ main.js＆GT;＆LT; / SCRIPT＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
app.js
使用严格的;angular.module（'roaMobileNgApp'，['UI']）
的.config（函数（$ routeProvider）{
$ routeProvider
。什么时候（'/'， {
templateUrl：意见/ main.html中，
控制器：'MainCtrl
}）
。除此以外（{
redirectTo：'/'
}）;
}）;
main.js
使用严格的;angular.module（'roaMobileNgApp'）
.controller（'MainCtrl'，函数（$范围）{
$ scope.customer = {名称：''，
ID：0}; $ scope.getDetails =功能（）{
$ scope.customer.name ='测试';
}; }）;
main.html中
＆LT; A HREF =＃NG点击=getDetails（）＆GT;＆刷新LT; / A＆GT;
＆LT; P＆GT;＆LT;输入类型=文本NG模型=customer.name＆GT; {{customer.name}}＆下; / P＆GT;＆LT; / DIV＆GT;
解决方案
这可能是因为你通过单击更改地址：
＆LT; A HREF =＃NG点击=getDetails（）＆GT;＆刷新LT; / A＆GT;
此迫使角重新呈现的HTML以及控制器。
如下更改：
＆LT; A HREF =JavaScript的：无效（0）NG点击=getDetails（）＆GT;＆刷新LT; / A＆GT;
I have an AngularJS test page with a "Refresh" link which calls a function, which, in return, updates the model "customer.name"
However, the "Refresh" click still doesn't change the {{customer.name}} in the view and I don't understand why.
Here is the content of my application.
index.html
<!doctype html>
<head>
<title>Test</title>
</head>
<body ng-app="roaMobileNgApp">
<script src="scripts/angular.js"></script>
<script src="scripts/angular-ui.js"></script>
<link rel="stylesheet" href="scripts/angular-ui.css">
<div class="container" ng-view=""></div>
<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>
</body>
</html>
app.js
'use strict';
angular.module('roaMobileNgApp', ['ui'])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.otherwise({
redirectTo: '/'
});
});
main.js
'use strict';
angular.module('roaMobileNgApp')
.controller('MainCtrl', function ($scope) {
$scope.customer = {name: '',
id: 0};
$scope.getDetails = function() {
$scope.customer.name = 'Test';
};
});
main.html
<a href="#" ng-click="getDetails()">Refresh</a>
<p><input type="text" ng-model="customer.name"> {{ customer.name }} </p>
</div>
解决方案
This is probably because you are changing the address by clicking:
<a href="#" ng-click="getDetails()">Refresh</a>
This forces angular to re-render the html as well as the controller.
Change it as below:
<a href="javascript:void(0)" ng-click="getDetails()">Refresh</a>
这篇关于NG-点击不更新模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
