2015-04-04 76 views
0

我希望這個問題的標題不會讓任何人感到困惑 - 但我需要找出一些看起來很基本的東西,但我似乎無法「明白」...angularjs如何使用多個其他過濾器對整數進行過濾?

基本上我有多個過濾器,其中兩個過濾數字。但是,如果我選擇「1」,如果一個數字是「1」(加利福尼亞在jsFiddle的例子中),另一個是「13」(亞利桑那州),則過濾將包括兩者。

這裏是我的HTML:

<div ng-app='app' ng-controller='myController'> 
<h3>Records: {{(projects|filter:filter).length}} of {{projects.length}}</h3> 
<p><input type="text" name="generalSearch" placeholder="Search Project Title" ng-model="filter.name"></p> 
<p><select ng-model="filter.stateID" 
     ng-options="item.stateID as item.state for item in st_option">  </select> 
    <select ng-model="filter.countyID" 
     ng-options="item.countyID as item.county for item in co_option | filter:{ co_state_id : filter.stateID }"> 
    </select></p> 

    <p><a href="" id="clear-filter" ng-click="clearFilter()">Reset Filters</a></p> 

    <div ng-repeat="project in projects | filter:filter"> 
    <div> 
    <br>Name: {{ project.name }} 
    <br>State: {{project.state}} 
    <br>County: {{project.county}} 
    <br> 
    <span ng-hide="{{project.stateID}} "></span> 
    <span ng-hide="{{project.countyID}} "></span> 
</div> 

JavaScript代碼:

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

app.controller('myController', function($scope) { 
    $scope.projects = [{ 
    name: 'First thing', 
    state: 'CA', 
    stateID: '1', 
    county: 'Orange', 
    countyID: '191' 
    }, { 
    name: 'Another Thing', 
    state: 'CA', 
    stateID: '1', 
    county: 'LosAngeles', 
    countyID: '190' 
    }, { 
    name: 'In California', 
    state: 'CA', 
    stateID: '1', 
    county: 'Orange', 
    countyID: '191' 
    }, { 
    name: 'Hey Arizona!', 
    state: 'Arizona', 
    stateID: '13', 
    county: 'Multiple Counties', 
    countyID: '3178' 
    },{ 
    name: 'hello Utah', 
    state: 'Utah', 
    stateID: '14', 
    county: 'Utah County', 
    countyID: '200' 
    }]; 

    $scope.st_option = [{ 
    state: "California", 
    stateID: "1" 
    }, { 
    state: "Arizona", 
    stateID: "13" 
    },{ 
    state: "Utah", 
    stateID: "14" 
    }]; 

    $scope.co_option = [{ 
    county: "Orange", 
    countyID: "191", 
    co_state_id: "1" 
    }, { 
    county: "Multiple Counties", 
    countyID: "3178", 
    co_state_id: "13" 
    }, { 
    county: "Sonoma", 
    countyID: "218", 
    co_state_id: "1" 
    }, { 
    county: "Los Angeles", 
    countyID: "190", 
    co_state_id: "1" 
    }, { 
    county: "Utah County", 
    countyID: "200", 
    co_state_id: "14" 
    }]; 

    $scope.filter = {}; 
$scope.clearFilter = function() { 
    $scope.filter = {}; 
    }; 
}); 

我創建了一個的jsfiddle這裏:

https://jsfiddle.net/webmastersean/4m2d5n8u/

我知道我需要添加「真實」的過濾器,但我不知道在哪裏或如何。

回答

0

filter具有第三參數,比較器功能。作爲語法糖,這第三個參數也可以取值true來表示嚴格的比較。這意味着,所有你需要做的就是添加:true到貴縣過濾器的結尾:

<select ng-model="filter.countyID" 
     ng-options="item.countyID as item.county for item in co_option | filter:{ co_state_id : filter.stateID }:true"> 
</select> 

Updated fiddle。現在,當你選擇加州時,你只能在加利福尼亞州獲得縣。

+0

嗨@ david-grinberg,我試圖通過stateID篩選列表。測試它我可以選擇加利福尼亞州和亞利桑那州和猶他州仍然顯示的結果,這是我想解決的問題。我只希望加利福尼亞在我選擇時顯示。 – 2015-04-04 17:16:56