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

根据子对象属性过滤ng-repeat列表

柯瀚玥
2023-03-14
问题内容

jsfiddle http://jsfiddle.net/KfSBq/

所谓子对象,是指我用ng-repeat显示的所有对象在其内部都包含一个对象列表,并且我希望根据这些子对象之一的属性进行过滤。

仅此一项就非常简单。我有个对象dailies,每个对象都包含dateentries对象列表:

function Ctrl($scope) {
    $scope.dailies = [{date: new Date('07/07/2013'), 
                       entries: [{category: 'A', note:'Lorem ipsum'}, 
                                 {category: 'B', note: 'Lorem ipsum'}]},
                      {date: new Date('05/02/2013'), 
                       entries: [{category: 'A', note: 'Lorem ipsum'}]}];
}

我按类别显示它们:

<div ng-controller="Ctrl">
        <div class="daily" ng-repeat="daily in dailies | orderBy:'-date' ">
            {{ daily.date | date:'dd/MM/y' }}
            <div class="entry" ng-repeat="entry in daily.entries | filter:{ category: 'B'} ">
                <span>{{ entry.category }}</span>, <span>{{ entry.note }}</span>
            </div>
        </div>
    </div>

我的问题是现在仍然显示不包含任何条目的日常对象。如何实现一种情况,如果过滤使entries列表为daily空,则该列表daily也不显示?


问题答案:

您可以在表达式内创建新的作用域成员。

这使您可以将过滤列表分配给新变量,该变量可以在整个本地范围内使用。这样,您可以将过滤列表的长度传递给ng-show:

<body ng-app>
  <div ng-controller="Ctrl">
    <div class="daily" 
      ng-repeat="daily in dailies | orderBy:'-date' " 
      ng-show="filteredEntries.length"
    >
      {{ daily.date | date:'dd/MM/y' }}
      <div class="entry" 
        ng-repeat="entry in filteredEntries = (daily.entries | filter:{ category: 'B'})"
      >
        <span>{{ entry.category }}</span>, <span>{{ entry.note }}</span>
      </div>
    </div>
  </div>
</body>

小提琴

顺便说一句,很好地提出问题!



 类似资料:
  • 问题内容: 我在javascript中有一组对象。内容看起来像这样; 我想保留一些对象并删除其余的对象。如果object属性为2或34,则将保留对象。其他对象被删除。遗嘱的结果看起来像这样; 我正在使用node.js v6.91。 编辑:有人建议我使用过滤器来解决这种问题。欢迎使用过滤器技术的答案。 问题答案: 您可以尝试以下方法1和2: 方法1 :(使用) 注意:这将返回一个新数组,并且不会修改

  • 问题内容: 我有以下JavaScript数组的房地产主页对象: 我想做的是能够对对象执行过滤,以返回“家庭”对象的子集。 例如,我想根据能够过滤:,,,和。 如何在JavaScript中执行类似下面的伪代码的操作: 注意,语法不必与上面完全相同。这只是一个例子。 问题答案: 您可以使用以下方法: 现场示例: 此方法是新ECMAScript 5th Edition标准的一部分,几乎可以在所有现代浏览

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

  • 我在一个网站上使用angularjs,那里有一个搜索输入,可以过滤视图上的列表。此列表显示为一个ng-repeat,该ng-repeat具有搜索输入中的筛选器: 搜索输入:

  • 问题内容: 我正在尝试根据布尔属性的值过滤一些列表项,但是无论我做什么,总会显示整个列表。我尝试过的一些东西已经坏掉了,什么也没显示,但这既不存在也不存在。我无法按需进行过滤: 使用以下ng-repeat过滤: 我觉得我已经尝试了所有可以找到引用的排列,其中大部分来自各种StackOverflow搜索结果: 我也尝试过创建自定义过滤器功能: 并因此应用它: 这些似乎都不起作用。我想念什么? 这是演

  • 我正在尝试过滤scala中对象列表的列表属性。例如: 用java定义的类 我的过滤器函数返回字符串列表而不是结果列表 UPDATE我想取回listOf中的所有结果,其中每个结果的名称属性被过滤。