Javascript 如何在ng if和变量中使用筛选器？

在本例中，我在中使用filter，但如何在变量中使用filter和

ng if

，类似于：

{{languages.length | filter: {available: true}}}

及

看

---

HTML

<div ng-controller="mainController">
    <div>There are {{languages.length}} languages in total.</div>
    <div>??? There are {{languages.length}} languages available.</div>
    <div ng-if="languages.length == 0">??? Sorry, there are no languages available.</div>

    <ol>
        <li ng-repeat="language in languages | filter: {available: true}">{{language.name}}</li>
    </ol>
</div>

你能试试这个吗

<div ng-controller="mainController">
    <div>There are {{languages.length}} languages in total.</div>
    <div>There are {{(languages|filter:{available:true}).length}} languages available.</div>
    <div ng-if="(languages|filter:{available:true}).length == 0">Sorry, there are no languages available.</div>

    <ol>
        <li ng-repeat="language in languages | filter: {available: true}">{{language.name}}</li>
    </ol>
</div>

总共有{{languages.length}}种语言。
有{（语言|筛选器：{available:true}）.length}语言可用。
抱歉，没有可用的语言。
{{{language.name}

只需更新之前的答案，无需过滤三次，在第一个过滤器上创建新变量“filtered”：

<div ng-controller="mainController">
    <div>There are {{languages.length}} languages in total.</div>
    <div>There are {{(filtered = (languages|filter:{available:true})).length}} languages available.</div>
    <div ng-if="filtered.length == 0">Sorry, there are no languages available.</div>       
    <ol>
        <li ng-repeat="language in filtered">{{language.name}}</li>
    </ol>

    filtered=[{{filtered}}]
</div>

总共有{{languages.length}}种语言。
有{（筛选=（语言{124;筛选：{available:true}））.length}语言可用。
抱歉，没有可用的语言。
{{language.name}
过滤=[{filtered}}]

T

F

---

这对我很有用

我不知道你为什么要这样做，只要你能做{{language.name}我只想显示有多少种语言可用，就像我显示总语言数一样。我可以制作一个函数来完成这项工作，并用JavaScript进行过滤，但我希望在HTML代码中有一种角度语法来完成这项工作。有时$scope中的短函数比HTML中的spagetti代码可读性更好。

<div ng-controller="mainController">
    <div>There are {{languages.length}} languages in total.</div>
    <div>There are {{(languages|filter:{available:true}).length}} languages available.</div>
    <div ng-if="(languages|filter:{available:true}).length == 0">Sorry, there are no languages available.</div>

    <ol>
        <li ng-repeat="language in languages | filter: {available: true}">{{language.name}}</li>
    </ol>
</div>

<div ng-controller="mainController">
    <div>There are {{languages.length}} languages in total.</div>
    <div>There are {{(filtered = (languages|filter:{available:true})).length}} languages available.</div>
    <div ng-if="filtered.length == 0">Sorry, there are no languages available.</div>       
    <ol>
        <li ng-repeat="language in filtered">{{language.name}}</li>
    </ol>

    filtered=[{{filtered}}]
</div>

<div ng-if="(answerText|lowercase)=='true'">T</div>