我只是想做一個簡單的事情，讓我頭痛。顯示所有的結果，當一個複選框未選擇angularjs過濾器

在Angularjs的應用程序中，我有一個帶有值的字典。我想用複選框過濾我的值。如果選中該複選框，則列表將刷新爲具有is_streaming：TRUE的元素。但是，如果複選框未選中。我想顯示所有結果。

目前，當複選框被選中時，它只顯示好的事件（這正是我想要的），但是當我取消選中時，我只有具有FALSE的元素。

var events = [{ 
    id: 0, 
    event_name: 'Concert 1', 
    is_streaming: 'true' 
    }, { 
    id: 1, 
    event_name: 'Concert 2', 
    is_streaming: 'true' 
    },{ 
    id: 2, 
    event_name: 'Concert 3', 
    is_streaming: 'true' 
    } 



<ion-toggle ng-model="is_streaming" toggle-class="toggle-calm">En ce moment</ion-toggle> 
<ion-list> 
<ion-item class="" ng-repeat="event in filtered=(events | filter:is_streaming)" type="item-text-wrap" href="#/tab/chats//{{event.id}}"> 
    <div class="player" ng-show="{{event.is_streaming}} == true"></div> 
</ion-item> 
</ion-list>

任何幫助或建議將很高興聽到。 THX

來源

2015-05-22 Okyne

你可以把小提琴/撬棍？ –

CodePen Demo

編輯：

更改您的複選框屬性使用NG-假值，並將其設置爲空：

<ion-toggle ng-model="search.is_streaming" ng-false-value="null" toggle-class="toggle-calm">En ce moment</ion-toggle>

然後您可以使用：

<ion-item class="" ng-repeat="event in events | filter: search.is-streaming" type="item-text-wrap" href="#/tab/chats//{{event.id}}">

來源

2015-05-22 15:10:29 jme11

我試過你的例子，但控制檯給了我一個錯誤'code'Error：[ngModel：constexpr]預計'ngFalseValue'的常量表達式，但看到''。'代碼' – Okyne

有趣。爲我完美工作。將不得不在一個離子項目中進行測試。在發佈之前，我使用Plunker中的複選框進行測試。 – jme11

對不起，你是正確的，它也爲我帶來了一個錯誤與最新版本。這只是一個簡單的解決方法，只是將ng-false-value設置爲null。 – jme11

所以，如果你只是想檢查is_streaming你不需要使用過濾器的值，這是更好地使用ngIf要做到這一點，看看下面的CodePen：

我換一個價值爲false，以測試它。 NG-如果語法：

<span ng-if"expression">display what you need </span>

來源

2015-05-22 14:38:44 carton

顯示所有的結果，當一個複選框未選擇angularjs過濾器

回答

CodePen Demo

相關問題