数据模型被外部JS修改,ng-repeat生成的checkbox无法绑定

苏甘霖 发布于 2015/12/17 15:40
阅读 1K+
收藏 0

最近在尝试用Angular,发现Angular中数据模型,被外部的JS修改时,Angular拿不到被修改后的数据。

如我的input绑定了ng-model,然后我在控制台自己写JS把这个input的值改了,在Angular里面,是拿不到被修改后的值的。

这个对于我现在要做的功能非常致命。

我现在用的日期控件和ng-repeat生成的checkbox或者radio被选中,Angular都拿不到值。

	<div ng-app="demo">
		<div ng-controller="myController">
			<h1>{{message}}</h1>
			<input type="text" ng-model="message"/>
			<input type="radio" name="radio" value="1" ng-model="a.radio"/>
			<input type="radio" name="radio" value="2" ng-model="a.radio"/>
			<input type="radio" name="radio" value="3" ng-model="a.radio"/>
			<br/>
			<input type="radio" name="radio" ng-value="radio.v" ng-model="a.radio2" ng-repeat="radio in radios" ng-change="aaa(radio.v)"/>{{radio.t}}
			<p>{{a}}</p>
		</div>
	</div>



var demo = angular.module('demo', []);
	
	demo.controller("myController", function($scope, $http){
		$scope.hello = "你好";
		$scope.message = "这是一个AngularJS控制器的入门例子";

		$scope.radios = [
		{v:1,t:"1"},
		{v:2,t:"2"},
		{v:3,t:"3"}
		];

		$scope.aaa = function(a){
			console.log(a);
		}
	})



像上面代码中,静态的radio被选中,在下面的{{a}}里面,是可以看到数据模型变化的。

但是repeat出来的radio没有反应,只能用ng-click在方法中赋值,但是如果checkbox这样弄就非常麻烦了。

我是刚学Angular的,很多东西还不懂,不知道有什么办法解决这个问题,都百度一下午了。。。

求大神

加载中
0
Sel8616
Sel8616
虽然没用过,但感觉似乎与缓存有关
Sel8616
Sel8616
回复 @苏甘霖 : 你同时使用2个不同的JS框架,这种问题也确实难免,不要太过依赖于框架啊,选一个主框架,各种小功能自己动动手实现就好了
苏甘霖
不是的,因为外部JS修改了数据,没有经过Angular,Angular并不知道这个数据被修改了,所以他拿不到值。 不知道如何解决这个问题
0
zhanglongyang
zhanglongyang

不是很清楚你的需求,但基于你最后说的“repeat出来的radio没有反应”,是因为`a`没有被初始化导致的。

在你的例子里面,如果先点击上面的radio,然后再点下面通过ng-repeat生成的radio,是可以看到Model变化的。

如果在它们之前将`a`进行初始化,就不会出现先点ng-repeat生成的radio不起作用的问题了。

http://codepen.io/zhanglongyang/pen/WrGzbb?editors=101

苏甘霖
大神,你说的这个,确实是这样的,我后面发现了这个问题。 但是像我说的外部JS修改数据模型的意思是 比如我用了一个日期控件,然后日期字段又是在Angular里面绑定了的,然后我用日期控件选了一个日期之后,在Angular里面,他拿不到用控件选择的那个值,应该是因为这个操作并没有经过Angular,而是在日期控件的JS中直接修改的,这个问题怎么办
返回顶部
顶部