在angularjs中使用選擇框時精確的文本過濾

我有一個基於狀態變化的具有某種狀態的選擇框，該項應該迭代，但問題是angularjs過濾器功能與確切的文本不匹配。在angularjs中使用選擇框時精確的文本過濾

HTML

<body ng-controller="sampleController"> 
<div> 
<select ng-model="test" ng-change="getfilter()"> 

    <option ng-repeat="item in list">{{item.status}}</option> 

</select> 
<ul> 

    <li ng-repeat="item in list | filter:test">{{item.name}}</li> 

</ul> 
<div>{{test}}</div>

控制器

function sampleController($scope){ 

    $scope.list = [ 
    {name: "item1", status: "shipped"}, 
    {name: "item2", status: 'Partially Shipped '} 
    ]; 

    $scope.getfilter = function(){ 



    } 

}

jsbin：http://jsbin.com/amuwol/2/edit

當我選擇 '運' 狀態，我需要得到的只有 '物品1'，但目前我我得到'item1'和'item2'。我只是定義了getfilter函數並停在那裏，因爲我沒有想法繼續下去。

請爲我提供的解決方案進行進一步

來源

2013-07-12 user1153484

你可以標記的問題作爲穩定當前支持的敏感回答如果答案解決了你的問題？ – callmekatootie

你需要實現自己的過濾器，因爲角度的默認過濾器使用toLowerCase（）。某事。像

filters.filter('exactString', function() { 
return function(string, term) { 
    return ('' + string).indexOf(term) > -1; 
}});

的jsfiddle角形1.0.7：http://jsfiddle.net/alfrescian/7sMQ8/

來源

2013-07-12 12:16:30 alfrescian

我也會嘗試這個選項。謝謝:) – user1153484

該過濾器正常工作。這不是你所面臨問題的原因。當您在選擇標籤中選擇shipped時，顯示第二個選項的原因是因爲第二個項目的狀態包含單詞「出貨」 - 「部分爲已發貨」。此外，您選擇了不區分大小寫的選項。

你有一些選擇：

使用不同的狀態，就像一個數字，表示如果該項目被運送或部分運送的東西。確保沒有子字符或數字出現在多個狀態中。這樣，選擇一個選項將確實篩選出不相關的項目。
首選選項 - 將第三個參數傳遞給過濾器。這第三個參數會告訴過濾器是否應區分大小寫。所以你可以使用類似的東西：
<li ng-repeat="item in list | filter:test:true">
「true」參數告訴Angular區分大小寫。這將失敗，而不是Partially Shipped"您將案例更改爲"partially shipped" - 即，使用小寫「已發貨」而不是大寫。
Bin

編輯：正如下面指出的那樣，「真正的」參數的設置以使過濾器對大小寫不公佈AngularJS

來源

2013-07-12 12:29:06 callmekatootie

請注意，區分大小寫的過濾器是相對較新的。例如。它不支持1.0.7 – alfrescian

@alfrescian啊。不知道這一點。 – callmekatootie

感謝您的解決方案:) – user1153484

在angularjs中使用選擇框時精確的文本過濾

回答

相關問題