javascript - ng-repeat 具有基于重复项的可选属性

Question

解决 ng-repeat 节点上具有可选属性的问题的最佳方法是什么:

<div ng-repeat="slice in pizza" mozzarella>
  {{slice.name}}
</div>

我只希望 mozzarella 属性出现在特定切片上。我怀疑这个问题没有简单的解决办法。也许有一个插件可以很好地解决这个问题？

我正在寻找的实现可能看起来类似于 ng-class 指令:

<div ng-repeat="slice in pizza" 
     ng-optional-attr="{'mozzarella': slice.mozzarella}">
  {{slice.name}}
</div>

Answer 1

您可以向 mozzarella 的隔离范围添加一个参数，以确定它是否处于事件状态:

<div ng-repeat="slice in pizza">
  <mozzarella isActive="true/false">{{slice.name}}</mozzarella>
</div>

你的指令看起来像这样:

angular.module('app', [])
.directive('mozzarella', function() {
  return {
    restrict: 'EA',
    transclude: true,
    scope: {
      isActive: '@'
    },
    link: function(scope) {
       if(scope.isActive){
          //Do stuff
       }
       else{
         //Do other stuff
       }
    },
    templateUrl: 'mozarella.html'
  };
});