Question

我正在构建一个表，其中行和列完全基于发送给它的数据构建。

我非常接近它的工作，我无法弄清楚如何构建自定义过滤器并动态传递过滤器模式

构成列的对象看起来像

{ name: 'transactionDate', displayName: 'Date / Time', displayOrder: 1, filter: "date: 'MM/dd/yy hh:mm a'" }

构成行的事务的对象如下所示：

{ transactionDate: '2015-06-11', transactionType: 'This Type', transactionAmount: 25 }

HTML 我有：

<td ng-repeat="col in columns">{{transaction[col.name] | dynamicFilter: col.filter}}</td>

我目前建立的过滤器是：

function dynamicFilter($filter) {
    return function (value, filter) {
        console.log(filter);
        console.log(value);
        var test = $filter(filter)(value);
        return test;
    }
}

过滤器和值都正确传递。我在查找如何在返回之前将过滤器应用于值时遇到问题。可传入的值为2015-06-10T16:17:14，传入的过滤器可能为date: 'MM/dd/yy hh:mm a'以创建日期/时间过滤器。或21和currency获取美元价值。

我希望能够以类似于视图的方式使用Angular的内置功能

Answer 1

对于具有部分参数的这些动态过滤器（例如您提供日期的格式），您必须从过滤器中删除该参数并稍后应用它。

所以filter: "date: 'MM/dd/yy hh:mm a'"，只需要filter: "date"。

附加约束MM/dd/yy hh:mm a将与值$filter(filter)(value, 'MM/dd/yy hh:mm a');

一起发送

要做到这一点，您可以利用apply。对象可以是：

{filter: { type: "date", params: ['MM/dd/yy hh:mm a'] } }

指令可以有（假设你也发送了params）：

var filterFn = $filter(filter.type); 
return filterFn.apply(filterFn, [value].concat(filter.params));

编辑：这是一个带有两个按钮的JSFiddle，第一个用“date：'MM / dd / yy hh：mm a'”演示你的原始方法，第二个演示了我应用的方法大纲http://jsfiddle.net/4whemakt/

Answer 2

您可以在dynamicFilter中有条件地应用并返回过滤后的值。像这样的东西

function dynamicFilter($filter) {
    return function (value, filter) {
        if (filter.indexOf('date:') !== -1) {
           //Note: I am using moment js to format the date
           return moment(value).format(filter.match(/'([^']+)'/)[1]);
        }
        else {
            return $filter(filter)(value)
        }
    }
}

moment.js参考http://momentjs.com/

在ng-repeat

2 个答案: