当 js 以角度调用过滤器时，它返回 null

Question

我是 Angular 的新手，我尝试在 angularJS 中使用 JavaScript 过滤器，但我得到了 null..

app.controller('aneesFilters', function($filter){
    this.filterItem = filterItems;
    this.filterJSItem = $filter('currency')(filterItems, 'price');

});

var filterItems = [
    {price: 1254},
    {price: 154},
    {price: 963},
    {price: 1880},
];

html代码：

    <div ng-controller="aneesFilters as filter">
        <div ng-repeat="item in filter.filterItem">
            <div>{{item.price | currency}}</div>
            <div>{{item.price | currency:"JOD"}}</div>
            <div>{{item.price | currency:"JOD":0}}</div>
            <hr />
        </div>

        <h2>By javascript (Used filter in controller)</h2>
        <div ng-repeat="item in filter.filterJSItem">
            <div>{{item.price}}</div>
            <hr />
        </div>
    </div>

当我在 Expression 上使用过滤器时，代码工作正常，调用 FilterJsItem 时出现问题..

非常感谢。

Answer 1

我创建了一个 plunker here

基本上我已经创建了另一个过滤器，它使用货币过滤器并对数组进行修改并返回过滤后的数组。

// 代码在这里

var app = angular.module("app", []);

app.filter('currenyArray',  function($filter) {
  return function(input, format, prop) { 
    input = input || [];
    var out = angular.copy(input);

    for (var i = 0; i < input.length; i++) {
      var p = $filter('currency')(input[i][prop],format);

      out[i][prop] = p;
       console.log( input[i][prop])
    }
    return out; 
  };
})

app.controller('myCtrl', function($filter, $scope){

  $scope.filterItem = [
    {price: 1254},
    {price: 154},
    {price: 963},
    {price: 1880},
];    



$scope.filterJS2 = $filter('currenyArray')($scope.filterItem, 'USD', 'price');

});

Answer 2

app.controller('aneesFilters', function($filter){
    this.filterItem = filterItems;
    this.filterJSItem = $filter('currency')(filterItems.price);

});