问题描述
我有一个简单的场景,其中有一个带有子控件(输入和文本区域)的formController。当我使用深度监视程序(objectEquality
等于true)检查整个表单中的更改时,我得到了Error: [ng:cpws]
这是基本代码(使用最新的angularJS):
<!doctype html>
<html lang="en">
<head>
<Meta charset="UTF-8">
<title>Example - example-forms-simple-production</title>
<script src="//code.angularjs.org/snapshot/angular.min.js"></script>
</head>
<body ng-app="formExample">
<div ng-controller="ExampleController">
<form novalidate class="simple-form" name="formContent">
<label>Name: <input type="text" ng-model="user.name" /></label><br />
<label>Description: <textarea ng_model="user.description"></textarea></label><br />
</form>
<pre>user = {{user | json}}</pre>
</div>
<script>
angular.module('formExample',[])
.controller('ExampleController',['$scope',function($scope) {
$scope.master = {};
$scope.$watch(() => $scope.formContent,(newValue,oldValue) => {
console.log('new ',newValue);
console.log('old ',oldValue);
},true);
}]);
</script>
</body>
</html>
控制台中的问题是:
angular.js:15697 Error: [ng:cpws] http://errors.angularjs.org/1.8.2-build.2468+sha.9b3b6f7f7/ng/cpws
at VM469 angular.min.js:7
at e (VM469 angular.min.js:13)
at c (VM469 angular.min.js:13)
at e (VM469 angular.min.js:13)
at c (VM469 angular.min.js:12)
at e (VM469 angular.min.js:13)
at c (VM469 angular.min.js:13)
at e (VM469 angular.min.js:13)
at Ia (VM469 angular.min.js:15)
at m.$digest (VM469 angular.min.js:153)
我不完全了解表单对象中的哪个属性导致了问题。根据angularJS文档,这可能是由于循环引用和自引用引起的
punker中的实时代码:https://plnkr.co/edit/B9n7GAPkZvzsFbKN?preview
解决方法
此问题的原因在这里说明:Unintended breaking change when passing ngModel as a binding 基本上,(从9e24e77开始)我们将作用域放在NgModelController实例上,因此不再可以复制此类实例(在$ watching发生在幕后)。