javascript - 如何根据 $scope.$watch 属性将 CSS 样式应用于指令内的 ng-repeat 元素？

Question

我的查看代码:

<div ng-repeat = "i in items track by $index">
   <myDirective label = "i.labels"> </myDirective>
</div>

部分指令代码:

return {
  scope : {
    label : '='
  }
  link : function($scope, elem, attrs){
     $scope.$watch('label', function(v){
        if(v[1] == "somevalue"){ // apply a css style to this ng-repeat item.}
     });
  }

}

我想根据v[1] 将css 样式应用于当前元素。 在指令中实现此目的的“Angular 方式”是什么？

Answer 1

您不必在示例中的指令内更改样式。你可以简单地做这样的事情:

<div ng-repeat="i in items track by $index" 
     ng-style="{ background: i.labels[1] == 'somevalue' ? 'red' : 'blue' }">
   <myDirective label="i.labels"></myDirective>
</div>

但是如果你真的想改变指令的样式，那么在我看来你应该将外部 div 放在指令的 View 中。这样，您就可以轻松地操纵它。