javascript - 对不同数据使用相同指令

Question

我对 Angular 指令有点陌生，想知道是否有办法多次使用相同的指令但绑定(bind)不同的数据？ (我确信有一种方法，我只是不知道如何!)

例如，我有以下两个表，我想将它们制作成 1 个指令，并以不同的方式传递数据:

1.这里我重复一个对象数组，如果 kv isPaint:true 那么我将打印下表..

<tr class="hover"
     ng-repeat="paint in allOptions | orderBy: 'listPrice'"
     ng-if="paint.isPaint"
     ng-click="addRemoveOption(paint)"
     ng-class="{'selected':isSelected(paint)}"
      >
    <td> {{ paint.code }}</td>
    <td> {{ paint.name }}</td>
    <td> {{ paint | includedOption }}</td>
    <td> {{ paint.disclaimer }}</td>
    <td> {{ paint.salesGroup }}</td>
    <td> {{ paint.optionPrev}}</td>
    <td> {{ paint.familyCode }}</td>

</tr>

我在这里做同样的事情，除了检查 trim 情况..

 <tr class="hover"
   ng-repeat="trim in allOptions | orderBy: 'listPrice'"
   ng-if="trim.isTrim"
   ng-click="addRemoveOption(trim)" 
   ng-class="{'selected':isSelected(trim)}"
  >
    <td> {{ trim.code }}</td>
    <td> {{ trim.name }}</td>
    <td> {{ trim | includedOption }}</td>
    <td> {{ trim.disclaimer }}</td>
    <td> {{ trim.salesGroup }}</td>
    <td> {{ trim.optionPrev }}</td>
    <td> {{ trim.familyCode }}</td>
  </tr>

我只需要从使用指令的页面访问 Controller ，这样我就可以访问“allOptions”。我想我可以通过在指令中设置scope:true来做到这一点？

我可以轻松地将 ng-repeat 名称更改为更通用，然后我只需要更改 ng-if 使其成为应在表中打印值的主要决定因素。所有表格列、数据等都完全相同，我只需要能够分离装饰、油漆、选项等。我发现了一个类似的帖子 Use same directive in same view and bind different data但我真的不知道这里发生了什么......

感谢您的帮助，如果我可以提供任何其他信息，请告诉我。

Answer 1

重复列表的简单指令:

app.directive('myDirective', function($compile) {
  return {
    restrict: 'E',
    scope: {
      list: '='
    },
    template: '<div ng-repeat="item in list">{{item.name}}</div>',

    replace: true,
    //require: 'ngModel',
    link: function($scope, elem, attr, ctrl) {

    }
  };
});

这是一个Plunker

这应该可以帮助您入门。