我正在尝试通过属性将对控制器范围进行引用的对象传递给angular指令。对象基本上代表了一些复杂的模型,该模型绑定到html。我的问题是它会被复制,并且当它到达作用域时会引发异常。
我有个笨拙的例子(https://next.plnkr.co/edit/0jCSMhWs6fgDEpMW)。 (在控制台中)例外是
previewer.41a48d826afff4888855.js:14 Error: [ng:cpws] Can't copy! Making copies of Window or Scope instances is not supported.
at VM838 angular.dew.js:144
at copyElement (VM838 angular.dew.js:1102)
at copyRecurse (VM838 angular.dew.js:1072)
at copyElement (VM838 angular.dew.js:1115)
at copyRecurse (VM838 angular.dew.js:1072)
at copyElement (VM838 angular.dew.js:1115)
at copy (VM838 angular.dew.js:1047)
at Scope.$digest (VM838 angular.dew.js:19294)
at Scope.$apply (VM838 angular.dew.js:19655)
at bootstrapApply (VM838 angular.dew.js:1981)
基本代码如下:
import angular from 'angular';
angular.module('plunker', []).controller('MainCtrl', function($scope, $rootScope) {
$scope.directiveModel = {
name: 'Kappa',
thatScope: $rootScope
};
}).directive('some', function (){
return {
scope: {
details: '=',
},
link: function (scope, element, attrs) {
element.append(scope.details.someProperty.name);
}
};
});
标记
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="lib/style.css">
<script src="lib/script.js"></script>
</head>
<body ng-app="plunker" ng-cloak>
<div ng-controller="MainCtrl">
<h1>Hello</h1>
<p some details='{someProperty: directiveModel}'>Start editing and see your changes reflected here!</p>
</div>
</body>
</html>