【问题标题】:AngularJS - hide/show div if date is within last 6 monthsAngularJS - 如果日期在过去 6 个月内,则隐藏/显示 div
【发布时间】:2020-09-15 11:35:00
【问题描述】:

我有一个ng-repeat,其中显示了日期列表以及有关该日期的购买信息。

HTML:

<div ng-repeat="data in MyData">
    <p>
        {{ data.purchasedOn.substring(6, data.purchasedOn.length - 2) | date:'dd/MM/yyyy' }}
    </p>
    <br>
    <p>
        {{ data.purchaseDescription }}
    </p>
</div>

其中显示:

01/02/2013
"Lorem ipsum dolor sit amet, consectetur adipisicing elit"

10/04/2014
"Lorem ipsum dolor sit amet, consectetur adipisicing elit"

02/08/2014
"Lorem ipsum dolor sit amet, consectetur adipisicing elit"

13/06/2014
"Lorem ipsum dolor sit amet, consectetur adipisicing elit"

19/02/2013
"Lorem ipsum dolor sit amet, consectetur adipisicing elit"

purchasedOn 在当前月份的最后 6 个月内时,我如何才能只显示{{ data.purchaseDescription }}

【问题讨论】:

  • 我会在 ng-repeat 上实现一个自定义过滤器。
  • @CodeHater - 你有例子吗?
  • 用一个例子添加到我的答案中

标签: angularjs angularjs-ng-repeat ng-show angular-filters ng-hide


【解决方案1】:

假设您想显示购买的日期而不是描述,您可以使用this one described here 之类的函数来确定 6 个月前的日期。

function addMonths(date, months) {
  date.setMonth(date.getMonth() + months);
  return date;
}

然后定义一个函数来获取布尔显示/隐藏值:

function shouldHide(purchasedOn){
    var purchaseDate = Date.parse(purchasedOn);
    var sixMonthsAgo = addMonths(new Date(), -6); 
    var hide = purchaseDate < sixMonthsAgo ? true : false;
    return hide;
}

现在您可以在 &lt;p&gt; 元素中的 ng-hide 中使用您的函数

<p ng-hide={{shouldHide(data.purchasedOn)}}>
    {{ data.purchaseDescription }}
</p>

编辑 如果你只是想隐藏整个元素,你可以像这样创建一个过滤器函数:

$scope.filterOldDates = function(date)
{
    if(shouldHide(date)){
        return false; 
    }
    return true; 
};

你会这样使用它:

<div ng-repeat="data in MyData | filterOldDates">

【讨论】:

    猜你喜欢
    • 2014-09-29
    • 2018-01-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-10-24
    • 1970-01-01
    相关资源
    最近更新 更多