AngularJS：过滤器数组

Question

我为带有数据的表创建了一个元素指令。 该表使用ng-repeat呈现所有行/列。

我为element指令创建了一个属性指令。 目的是获取您不希望包含在表中的列。 完整指令可能如下所示：

<extended-table exclude="columnone, columntwo"></extended-table>

该表解释为：

<table>
    <tr>
        <th ng-repeat="column in columns">
        {{column}}
        </th>
    </tr>
    <tr ng-repeat="row in data | startFrom:currentRow">
        <td ng-repeat="column in columns">
            {{row[column]}}
        </td>
    </tr>
</table>

在ng-repeat ，我希望它忽略exclude中的值，但是我对从这里去哪里有些迷茫。

app.directive('exclude', function () {
    return function (scope, element, attrs) {

        var params = attrs.exclude.split(',');

        for (var i = 0; i < params.length; i++) {
            params[i] = params[i].trim();
        }

        scope.exclude = params;
    };
});

如果该列包含在$scope.exclude数组中，如何使ng-repeat忽略标题和行的列？

app.filter('startFrom', function () {
    return function (input, start) {
        start = +start;
        return input.slice(start);
    };
});

Answer 1

我的建议是改为通过extended-table指令读取exclude属性，而不是创建自定义指令来执行此操作。

这是一些不完整的代码，显示了如何完成此操作：

myModule.directive('extended-table', function() {
    return {
...
      scope: {
        'exclude': '@' // This says to load the attribute 'exclude' into a scope property of the same name.
      }
...
    // In your link functions you could process the scope.exclude property as you wish.
    };
  });

可以在The Hitchhikers Directive Guide中找到更多信息：

@ – binds the value of parent scope property (which always a string) to the local scope. So the value you want to pass in should be wrapped in {{}}. Remember `a` in braces.
= – binds parent scope property directly which will be evaluated before being passed in.
& – binds an expression or method which will be executed in the context of the scope it belongs.

这种方法的最大优点是您不会创建两个相互依赖的指令。

注意：

使用@进行绑定时，请记住以{{}}表示法传递属性：

    <myDirective myDirectiveAttribute="{{someProperty}}"/>