Angular Directive刷新参数更改

链接函数只被调用一次,因此它不会直接执行您期望的操作.您需要使用角度$watch来观察模型变量.

需要在链接功能中设置此手表.

如果对指令使用隔离范围,那么范围就是

scope :{typeId:'@' }

在您的链接功能中,您可以添加一个类似的手表

link: function(scope, element, attrs) {
    scope.$watch("typeId",function(newValue,oldValue) {
        //This gets called when data changes.
    });
 }

如果您没有使用隔离范围,请使用手表 some_prop

您要做的是监视指令中属性的属性.您可以使用$ observe()查看属性更改的属性,如下所示:

angular.module('myApp').directive('conversation', function() {
  return {
    restrict: 'E',
    replace: true,
    compile: function(tElement, attr) {
      attr.$observe('typeId', function(data) {
            console.log("Updated data ", data);
      }, true);

    }
  };
});

请记住,我在这里使用了指令中的'compile'函数,因为你没有提到你是否有任何模型以及这是否对性能敏感.

如果您有模型,则需要将" 编译 "功能更改为" 链接 "或使用" 控制器 "并监视模型更改的属性,您应该使用$ watch(),并采用角度{{}}来自财产的括号,例如:

<conversation  type="convo" type-id="some_prop"></conversation>

在指令中:

angular.module('myApp').directive('conversation', function() {
  return {
    scope: {
      typeId: '=',
    },
    link: function(scope, elm, attr) {

      scope.$watch('typeId', function(newValue, oldValue) {
          if (newValue !== oldValue) {
            // You actions here
            console.log("I got the new value! ", newValue);
          }
      }, true);

    }
  };
});