2017-01-18 7 views
0

簡単な質問AngularJSで検索結果をフィルタリングする

私はangularjsにフィルタを作成して、変数を動的に取得し、フロントエンドからこのように使用します。

<div ng-if="(services | searchValue : 'type' : 'facebook').active == true"> 
... 
</div> 

これはjavascriptです。

.filter('searchValue', function() { 
     return function (array, name_var, value) { 
      angular.forEach(array, function(v, k) { 
       if (v[name_var] == value) { 
        return v; 
       } 
      }); 
      return []; 
     }; 
    }) 

残念ながら、結果が見つかったとしても、テンプレートに渡されませんでした。

私はこのようにそれを使用します場合:これは何の値を取得しません

{{(services | searchValue : 'type' : 'facebook')}} 

。なにか提案を?

+0

私はそれはのようにすべきだと思います(サービス| searchValue: 'タイプ') –

答えて

1

提供した情報のサンプル例を作成しました。以下の例のチェックを実行します。これがあなたを助けることを願ってください。

ng-ifは、変数であって式ではないと予想しています。変数には値(services | searchValue : 'type' : 'facebook').activeの式ではなく、変数のみを指定します。

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

 
app.filter('customfilter', function() { 
 
    return function(array, name_var, value) { 
 
    var filteredArray = {}; 
 
    angular.forEach(array, function(v, k) { 
 
     if (v[name_var] == value) { 
 
     filteredArray = v; 
 
     return false; 
 
     } 
 
    }); 
 
    return filteredArray; 
 
    } 
 

 
}); 
 
app.controller('sampleController', function($scope, $filter) { 
 
    $scope.data = [{ 
 
    "type": "facebook", 
 
    "active": false 
 
    }, { 
 
    "type": "linkedin", 
 
    "active": false 
 
    }, { 
 
    "type": "twitter", 
 
    "active": false 
 
    }, { 
 
    "type": "google", 
 
    "active": false 
 
    }]; 
 

 
    $scope.anotherdata = [{ 
 
    "type": "facebook", 
 
    "active": true 
 
    }, { 
 
    "type": "linkedin", 
 
    "active": false 
 
    }]; 
 
});
<script data-require="[email protected]" src="https://code.angularjs.org/1.3.17/angular.js" data-semver="1.3.17"></script> 
 

 
<body ng-app="application"> 
 
    <div ng-controller="sampleController"> 
 

 
    First div - Active : false 
 
    <div ng-if="(data | customfilter:'type':'facebook').active"> 
 
     Your div content goes over here 
 
    </div> 
 
    <br> 
 
    <br>Second div - Active : true 
 
    <div ng-if="(anotherdata | customfilter:'type':'facebook').active"> 
 
     Second div rendered 
 
    </div> 
 
    </div> 
 
</body>

関連する問題