在自定義過濾器中調用$ scope（angular）

Question

我正在使用此角度過濾器來過濾數組中的對象，其localteam_id屬性與$scope.whichMyteam保存的值匹配。 這很好用。

視圖

<div ng-repeat="fixture in getFixtures | filter: {localteam_id: whichMyteam} ">

我想擴展過濾器，包括一個部分標准：所以它實際上是：

<div ng-repeat="fixture in getFixtures | filter: {localteam_id: whichMyteam && visitorteam_id: whichMyteam} ">

...但是a）這不起作用，並且b）即使它確實如此，它也會變得有點麻煩，並且似乎有理由制作自定義濾鏡。

所以，我試着制作一個。 我遇到的問題是我需要在過濾器中引用$scope.whichMyteam值，但似乎過濾器模塊無法接受/理解$scope 。 這對於我的實例中的過濾器至關重要，所以我不知道如何解決這個問題。

到目前為止，我的過濾器如下所示：

app.filter('myFixtures', function() {

      return function(input) {
        angular.forEach(input, function(o) {
          output = [];
          if (o.localteam_id === $scope.whichMyteam) {
            output.push(o);
          }
          return output;
      })
    };

  });

以上是一個簡化版本，它只試圖匹配一個屬性（只是這樣做來測試它並減少移動部件的數量）。 當我在視圖中調用它時...

<div ng-repeat="fixture in getFixtures | myFixtures">

......它不起作用。 控制台日志'$ scope未定義'。

---

更新：我試過這個，仍然無法正常工作！

過濾

var myFilters = angular.module('myFilters', [])

    myFilters.filter('myFixtures', function(whichMyteam) {

      return function(input) {

        angular.forEach(input, function(o) {

          output = [];

          if (o.localteam_id === whichMyteam) {
            output.push(o);
          }
          return output;

      })

    }

  });

視圖

  <div ng-repeat="fixture in getFixtures | myFixtures(whichMyteam)">

---

控制台正在記錄語法錯誤（我認為...）

angular.js:13236 Error: [$parse:syntax]

Answer 1

讓過濾器函數返回一個函數怎么樣？

app.filter('myFixtures', function() {
  return function(input, whichMyteam) {
    output = [];
    angular.forEach(input, function(o) {
      if (o.localteam_id === whichMyteam) {
        output.push(o);
      }
    })
    return output;
  };
});

然后調用傳遞變量的過濾函數

<div ng-repeat='fixture in getFixtures | myFixtures:whichMyteam'>

---例子

 angular .module('app', []) .filter('otherFilter', otherFilter) .controller('controller', controller); controller.$inject = ['$scope']; function controller($scope) { $scope.things = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]; $scope.modVal = 2; console.log('controller'); $scope.myFilter = function(x) { return function(y) { return (y % x) === 0; } }; } function otherFilter() { return function(y, x) { var out = []; angular.forEach(y, function(val) { if ((val % x) === 0) { out.push(val) } }); return out; } } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app='app' ng-controller='controller'> <div ng-repeat='thing in things | filter:myFilter(modVal)'> {{ thing }} </div> <br/> <div ng-repeat='thing in things | otherFilter:modVal'> {{ thing }} </div> </div> 

Answer 2

你有兩個問題：1。如何傳遞一個參數，html：

<div ng-repeat="fixture in getFixtures | myFixtures:whichMyteam">

JS：

    myFilters.filter('myFixtures', function() {

      return function(input, whichMyteam) {
...

2. 不要將return語句放在forEach中 - 它不會使你想到的;）

所以最后你的過濾器是：

myFilters.filter('myFixtures', function() {

 return function(input, whichMyteam) {

    output = [];

    angular.forEach(input, function(o) {
      if (o.localteam_id === whichMyteam) {
        output.push(o);
      }
    })

    return output;
  }
});

http://plnkr.co/edit/0XFfI8hIdCaJ19gJRYr2?p=preview