AngularJS-如果日期在过去6个月内,则隐藏/显示div [英] AngularJS - hide/show div if date is within last 6 months

查看:87
本文介绍了AngularJS-如果日期在过去6个月内,则隐藏/显示div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I have an ng-repeat that displays a list of dates, and information about purchases on that dates.

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}} ?

How can i only show the {{ data.purchaseDescription }} when purchasedOn is within the last 6 months from the current month?

推荐答案

假设您要显示PurchasedOn而不是说明,则可以使用

Assuming that you want to show purchasedOn but not the description, you could use a function like this one described here to determine a date 6 months prior.

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

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

Then define a function to get a boolean show/hide value:

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

现在,您可以在< p> 元素中的ng-hide中使用您的函数

Now you can just use your function in an ng-hide in your <p> element

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

编辑如果您只想隐藏整个元素,则可以制作一个过滤器功能,如下所示:

EDIT If you do just want to hide the entire element, you could make a filter function like this:

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

您将像这样使用它:

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

这篇关于AngularJS-如果日期在过去6个月内,则隐藏/显示div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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