对于ngRepeat AngularJS limitTo过滤的对象上(使用像字典) [英] AngularJS limitTo filter for ngRepeat on an object (used like a dictionary)

查看:833
本文介绍了对于ngRepeat AngularJS limitTo过滤的对象上(使用像字典)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

是否有可能使用其上重复一个对象的属性 ngRepeat 指令而不是 limitTo 过滤器数组中的项目。

据我所知,官方文档说,输入 limitTo 必须是一个数组或一个字符串。但是,不知道是否有一种方式来获得这个工作。

下面是一个示例code:

 <李NG重复=(键,项目)的phones_dict |排序依据: - 年龄| limitTo:limit_items>< /李>

$ scope.phones_dict

对象

  {
     ITEM_1:{名字:约翰,年龄:24},
     ITEM_2:{名字:杰克,年龄:23​​}
}


解决方案

limitTo仅适用于字符串和数组,对象使用自己的过滤器,例如:

  myApp.filter('myLimitTo',[功能(){
    返回功能(OBJ,限制){
        VAR键= Object.keys(OBJ);
        如果(keys.length&所述; 1){
            返回[];
        }        VAR RET =新的对象,
        计数= 0;
        angular.forEach(键,功能(键,arrayIndex){
            如果(计数> =极限){
                返回false;
            }
            RET [关键] = OBJ [关键]
            算上++;
        });
        返回RET;
    };
}]);

这是小提琴例如: http://jsfiddle.net/wk0k34na/2/

Is it possible to use limitTo filter on a ngRepeat directive which is repeating the properties of an Object and not items in an Array.

I am aware that the official documentation says that the input to limitTo needs to be an array or a string. But wondering if there's a way to get this to work.

Here's a sample code:

<li ng-repeat="(key, item) in phones_dict |orderBy:'-age'| limitTo:limit_items"></li>

And $scope.phones_dict is an Object like

{ 
     item_1: {name:"John", age: 24},
     item_2: {name:"Jack", age: 23}
}

解决方案

limitTo works only for strings and arrays, for object use own filter for example:

myApp.filter('myLimitTo', [function(){
    return function(obj, limit){
        var keys = Object.keys(obj);
        if(keys.length < 1){
            return [];
        }

        var ret = new Object,
        count = 0;
        angular.forEach(keys, function(key, arrayIndex){
            if(count >= limit){
                return false;
            }
            ret[key] = obj[key];
            count++;
        });
        return ret;
    };
}]);

Example on fiddle: http://jsfiddle.net/wk0k34na/2/

这篇关于对于ngRepeat AngularJS limitTo过滤的对象上(使用像字典)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆