JavaScript | AngularJS:根据日期过滤结果过滤项目

JavaScript | AngularJS: Filter Items by Date-Filter Result

本文关键字：过滤 日期 结果 项目 AngularJS JavaScript      更新时间：2023-09-26

按日期筛选结果筛选项目

在ng-repeat的内部，使用| date过滤器过滤createdAt属性。在ng-repeat中，item in items由term得到| filter。换句话说，我的代码看起来像这样:

<input placeholder="search" ng-model="term" />
<div ng-repeat="item in items | filter:term">
    {{item.createdAt | date}}
</div>

很基本。date过滤器接受2015-09-03T00:12:43.107Z的(ISO?)日期，并返回类似Sep 2, 2015的内容。

的场景:

item显示过滤后的createdAt文本，例如Sep 2, 2015。用户搜索"2"——并减少数组结果，只显示那些按日期结果过滤的项目符合他们的条件。

用户刚刚完成了按日期过滤项目——但更重要的是，根据date过滤器的返回值，按对用户可见的日期过滤项目。

有没有一种方法可以在不编写自定义过滤器的情况下实现这一点-或者我需要使用使用$filter('filter') &$filter('date') ?

可能是这样的:

item in items | filter:{date: (term | date:'ISO'), name: term}
// converts term back to ISO for matching (ideally)

我想这也应该知道term 是一个日期之前尝试过滤它，因为term也应该过滤items，如果item.name上也有匹配。编辑:您可以通过date过滤器运行文本值并返回相同的值。

Thanks in advance

What Worked For Me

由于我的需要是保持较低的复杂性，同时尽可能地使实现与本机filter功能保持一致——我得出了以下结论:

不过滤显示日期:

<ul>
    <li>
        <input type="text" ng-model="q" />
    </li>
    <li ng-repeat="order in orders | filter:q">{{order.createdAt | date:'short'}}</li>
</ul>

根据显示的日期(和其他任何内容)进行过滤:

<ul>
    <li>
        <input type="text" ng-model="q" />
    </li>
    <li ng-repeat="order in orders | filter:q" ng-init="order['|'] = { createdAt: (order.createdAt | date:'short') }">{{order['|'].createdAt}}</li>
</ul>

这个工作得很好，因为我不需要对进行任何专门化——只需用一个额外的属性(在|命名空间下面)初始化迭代，当用户的输入发生变化时，Angular会自动过滤它。现在用户可以根据他们看到的或任何其他属性进行过滤。

干杯!

相关文章：