未调用 angularjs 指令

Question

我正在尝试将动画类应用于范围值更改，但指令永远不会在这里被调用。

    <md-card animateOnChange="currentCard.fab_id">
    <md-card-header-text>
      <span class="md-subhead">Id: {{currentCard.fab_id}} </span>
    </md-card-header-text>
  </md-card-header>
</md-card>

指令：

.directive('animateOnChange', function($timeout) {
   return function(scope, element, attr) {
        scope.$watch(attr.animateOnChange, function(nv,ov) {
            if (nv!=ov) {
                element.addClass('animated shake changed');
                $timeout(function() {
                    element.removeClass('animated shake changed');
                }, 1000);
            }
        });
    }
  })

Answer 1

试试：

<md-card animate-on-change="currentCard.fab_id">

和：

scope.$watch(attr.animateOnChange, function(nv,ov) {...}

因为 angularjs 规范了指令和属性。见https://docs.angularjs.org/guide/directive