当前位置: 首页 > 面试题库 >

如何在AngularJs中使用ng-repeat过滤(键,值)?

寇甫
2023-03-14
问题内容

我正在尝试做类似的事情:

<div ng-controller="TestCtrl">
    <div ng-repeat="(k,v) in items | filter:hasSecurityId">
        {{k}} {{v.pos}}
    </div>
</div>

AngularJs部分:

function TestCtrl($scope) 
{
    $scope.items = {
                     'A2F0C7':{'secId':'12345', 'pos':'a20'},
                     'C8B3D1':{'pos':'b10'}
                   };

    $scope.hasSecurityId = function(k,v)
    {
       return v.hasOwnProperty('secId');
    }
}

但是不知何故,它向我展示了所有物品。如何筛选(键,值)?


问题答案:

Angular
过滤器只能通过angular的API应用于数组,而不能应用于对象-

“从数组中选择项的子集,并将其作为新数组返回。”

您在此处有两个选择:
1)移至$scope.items数组或
-2)预过滤ng-repeat项目,如下所示:

<div ng-repeat="(k,v) in filterSecId(items)">
    {{k}} {{v.pos}}
</div>

并在控制器上:

$scope.filterSecId = function(items) {
    var result = {};
    angular.forEach(items, function(value, key) {
        if (!value.hasOwnProperty('secId')) {
            result[key] = value;
        }
    });
    return result;
}

jsfiddle :http :
//jsfiddle.net/bmleite/WA2BE/



 类似资料:
  • 问题内容: 在我的控制器中,我有如下数据: 现在,此数据是包含键和值的字典。 我可以使用模板中的属性。有什么办法可以遍历键并将它们显示在表格中吗? 数据是这样的 问题答案: 怎么样: 该方法在docs中列出:https : //docs.angularjs.org/api/ng/directive/ngRepeat

  • 问题内容: 查看实时代码: 角JS 到底如何正确遍历嵌套键值对并正确输出,如下所示? 我要的是一棵像这样的树 当前视图是: JS: HTML: 问题答案: 您非常接近,我更新了小提琴。http://jsfiddle.net/y9wj6/9/

  • 问题内容: 我在文档中看到了过滤器,该过滤器允许我限制前5个或最后5个结果,但是我想设置限制的起始位置,以便显示第二组5个结果。 是否有内置的过滤器? 问题答案: 从Angular 1.4.0开始,过滤器接受一个可选参数: 在旧版本中,编写自定义过滤器非常简单。这是一个简单的实现(请注意,您传递的是第一个和最后一个索引,而不是一个计数): 可用的jsFiddle:http://jsfiddle.n

  • 问题内容: 我是AngularJS的新手,我正在构建一个小型的概念验证租车清单应用程序,该应用程序会提取一些JSON,并通过ng- repeat并使用几个过滤器来呈现这些数据的各个部分: 现在,我想在控制器中创建一个自定义过滤器,该过滤器可以迭代ng-repeat中的项目,并仅返回满足特定条件的项目-例如,我可以根据哪个“ provider”复选框创建值数组进行检查,然后评估每个ng-repeat

  • 问题内容: 我有一个简单的导航对象设置,其中列出了导航项(以及它们是否应出现在主导航中)。看来,当我尝试将ng-if与ng- repeat混合使用时,情况会分崩离析,但是当我将ng-show与ng- repeat混合使用时,它可以正常工作(但是最后我得到了一堆隐藏的元素,但我没有想要附加到DOM)。 但是以下操作无效(请注意,现在是): 路线对象看起来像 尝试使用时收到以下错误: 错误:多个指令[

  • 问题内容: 我想知道Angular中是否有一种简单的方法,可以使用特定的列(而非逻辑)来过滤表。现在,当我的过滤器实际上只需要过滤2列数据(ID和Name)时,它就会搜索表中的所有内容(10列以上的数据)。 我设法使它仅在过滤时仅查看这两列(通过根据文档在过滤器表达式中使用一个对象并查看此SO答案,但是它使用的是逻辑,太具体了。我想让它使用逻辑,但是遇到了麻烦。 我的HTML 我的过滤逻辑: 过滤