定义了这么一个模块,用了angular原生的ngRoute
var app = angular.module('NewsPub', ['ngRoute']);
//配置路由,controller为下面定义的AddController
app.config['$routeProvider', function($routeProvider) {
$routeProvider.when('/add', {templateUrl: add.html,controller: 'AddController'});
}
app.controller('AddController',function($scope){
$scope.title = '';
var a = {prop: $scope.title};
$scope.add = function(){
console.dir(a);
}
});
在id为add.html的ng-template使用了ng-model绑定了$scope中title的值,并且设置按钮绑定add()事件
<input type="text" ng-model="title" value="标题">
<span>{{title}}</span>
<button ng-click="add()">Btn</button>
现在问题来了,如下图所示,改变input框内的值,<span>内的值会跟着改变,这说明数据有存在双向绑定,即$scope.title会随着input框内的值改变而改变。
但是,不管怎样改变input框内的值,点击button内触发add()事件时,控制台输出的a对象的prop属性永远是$scope.title的初始值''(不会随title的值改变而改变)
请求大神打救一下,自己是菜鸟,搞了很久都搞不明白,无尽感激!
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
你页面的input绑定的是$scope.title,而不是你的a.prop,你在input里面输入改变的是$scope.title,是angular帮你改变的,但是你的a.prop没人再赋值给它啊,所以一直都是你开始赋的值,就是""。
这是变量引用问题
`$scope.title = '';
创建了两个对象属性对
''的引用,你改变了$scope.title的值,就是断掉了$scope.title的引用,但是a.prop依然保持对''的引用建议看一下 理解AngularJS的作用域Scope 这篇文章。