这是一个plunker，它很好地展示了我正在尝试做的事情。
我有一个指令！孤立的范围！具有要更改的属性
<div ng-init="environment='natural'">
<input ng-model=environment>
<chameleon env="{{ environment }}"></chameleon>
</div>
我希望我的指令响应全局范围的更改：
angular.module('app', []).directive('chameleon', function () { return {
template: 'I am {{ color }}',
scope: {} // isolated
,link: function (scope, element, attrs) {
scope.$watch('env', function () {
scope.color = getColor();
});
function getColor () {
switch (attrs.env) {
case 'excited': return 'red';
...
case 'natural':
default: return 'green';
}
}
/* here I need something similar to this not-working code :
* element.on('attributeChange', function () {
* scope.env = attrs.env
* });
*/
}
}});
我知道我可以使用隔离范围来绑定周围范围的值，例如
scope: {
env: '='
}
但是我真的需要有一个独立的组件，因为属性的值env不仅会从模型中更改。
随意分叉我的朋克。
您需要使用attrs.$observe与相同的功能$watch。它作用于{{}}价值，价值的变化将调用该$observe函数。
代码
attrs.$observe('env', function() {
scope.color = getColor();
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句