当数组为空Angular.js时,不显示任何值

时间:2015-11-22 12:00:32

标签: javascript angularjs

我正在学习angular.js并试图确定对我来说最简单的方法是在数组为空时显示消息'找不到值'。

我试过这个没有用的

 <ul>
        <li ng-show="!items.length">No values</li>
        <li ng-repeat="i in items | searchFor:searchString">                
            <p>{{i.title}}</p>
        </li>
    </ul>

我的控制器

app.filter('searchFor', function () {
return function (arr, searchString) {
    if (!searchString) {
        return arr;
    }
    var result = [];
    searchString = searchString.toLowerCase();
    angular.forEach(arr, function (item) {
        if (item.title.toLowerCase().indexOf(searchString) !== -1) {
            result.push(item);
        }
    });
    console.log(result.length);
    return result;
}
});

如果没有返回值,我怎么能显示消息'找不到值?

2 个答案:

答案 0 :(得分:5)

在ng-if或ng-show中使用过滤后的数组

<ul>
    <li ng-repeat="i in filteredItems = (items | searchFor:searchString)">                
        <p>{{i.title}}</p>
    </li>
    <li ng-show="!filteredItems.length">No values</li>
</ul>

答案 1 :(得分:1)

这有效:

<ul>
     <li ng-show="!(items | searchFor:searchString).length">
           No values
     </li>
     <li ng-repeat="i in items | searchFor:searchString">                
            <p>{{i.title}}</p>
     </li>
</ul>

尝试JSFiddle