Edward Tanguay Edward Tanguay - 5 months ago 34
AngularJS Question

How to use filter in ng-if and variable?

In this example, I use filter in the ng-repeat, but how do I use it in a variable and

ng-if
, something like:

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


and

ng-if="languages.length == 0 | filter: {available: true}"


See Fiddle.




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>


AngularJS

$scope.languages = [
{id:1, name:"German", available: false},
{id:2, name:"English", available: true},
{id:3, name:"French", available: false},
{id:4, name:"Italian", available: true},
{id:5, name:"Spanish", available: false}
];

Answer

Can you try this?

<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>