Question

我在flag的{{1}}内使用名为cellTemplate的自定义指令。该指令只接受国家/地区名称（美国或加拿大），并显示其相应的标志。第一次加载页面时，该指令正常工作。但是，稍后即使我将flag的值更改为任何内容，自定义指令也不会更新并显示新标志。不知道我错过了什么。

Plnkr

Answer 1

该指令被编译一次！您需要观察属性或设置双向绑定！

app.directive('flag', function() {
  var flags = {
    USA: 'https://github.com/hjnilsson/country-flags/raw/master/png100px/us.png',
    CANADA: 'https://github.com/hjnilsson/country-flags/raw/master/png100px/ca.png'
  };

  return {
      restrict: "A",
      scope: {
          flag: "@"
      },
      link: function(scope, elem, attrs) {
          scope.$watch('flag', function(newValue, oldValue){
              angular.element(elem).attr('src', flags[newValue]);
          });
      }
  };
});

working plunkr ==＆gt; http://plnkr.co/edit/dcHDMEY8MpQnCnm99aDd?p=preview

自定义指令不会在ui-grid的cellTemplate中更新

1 个答案: