javascript - 在更改父范围时更新 angularJs 指令范围变量

Question

我正在 angularJS 中创建一个指令，它将替换该元素。我在父作用域中有一个变量，它绑定(bind)到该元素。

我想在更改父范围变量值时更新指令范围变量。

元素如下所示

<my-element attr-xyz="scope_variable"></myelement>

当我编写如下指令时，每当作用域变量更新时，它都会给出更新的值

.directive('myElement', function(){
    return function(scope, elem, attr){
        scope.$watch(attr.attrXyz, function(value) {
            console.log(value);
        });
    }
});

但是当我编写如下相同的代码时，它会给出未定义的值

return {
    scope: {attrXyz: '@'},
    restrict: 'E',
    replace: true,
    link: function(scope, element, attr, controller){
        scope.$watch(attr.attrXyz, function(value){
            console.log('value = '+value);
        });
    }
}

Answer 1

两种方式都有效。 (指令 1-2)http://plnkr.co/edit/2kJT1mkaORsS8RUOyZ0N?p=preview

但是，如果您引入隔离范围 - 第二种方法不起作用。 (指令3)

然后你可以使用$observe(指令4)

  attr.$observe('attrXyz', function(value){
      console.log('4: '+ value);
  });

或者您可以在范围内定义它并使用 watch。