如果日期是今天，AngularJS 在 div 中显示，否则在其他 div 中显示答案

【问题标题】：AngularJS show in div if date is today, otherwise show in other div如果日期是今天，AngularJS 在 div 中显示，否则在其他 div 中显示
【发布时间】：2016-06-19 16:30:33
【问题描述】：

我的想法是我的数组中有几个项目，它们具有标题、公司和日期值。然后将它们显示在带有 ng-repeat 的 div 中。

如果日期值是今天的日期，我希望它们显示在第一个 div 中，如果日期值不是今天，则显示在不同的 div 中。（理想情况下，我会在今天、昨天、上周等中将它们分开。）

它当前所做的是在第一个 div 中显示日期并将它们的日期显示为今天，即使该值没有像数组中那样设置。而第二个 div 完全是空的。

JS：

var app = angular.module("myApp", []);

app.controller("boardController", function($scope) {
    $scope.today= new Date();
    $scope.posts = [
       {
           "Title" : "Alfreds Futterkiste",
           "Company" : "Microsoft",
           "Date" : "2016-06-19",

        },{
            "Title" : "Berglunds snabbköp",
            "Company" : "IBM",
            "Date" : "2016-06-18",
        },{
            "Title" : "Centro comercial Moctezuma",
            "Company" : "MexaTel",
            "Date" : "2016-06-03",
        },{
            "Title" : "Ernst Handel",
            "Company" : "BlaBlaCar",
            "Date" : "2016-06-11",
        }
    ]
});

HTML 的结构如下：

<body ng-controller="boardController">
        <!--  Products Container  -->
        <div class="col-xs-12 col-md-8 col-md-offset-2">
            <!--  Product Container  -->
            <h2>Today</h2>
            <div class="list-group-item" ng-repeat="post in posts">
                <div ng-if="post.Date = today">
                    <h3>
                        {{post.Title}}
                    </h3>
                    <h5>
                        {{post.Date | date : 'EEE MMM d'}}
                    </h5>
                </div>
            </div>
            <h2>Yesterday</h2>
            <div class="list-group-item" ng-repeat="post in posts">
                <div ng-if="post.Date > today">
                    <h3>
                        {{post.Title}}
                    </h3>
                    <h5>
                        {{post.Date | date : 'EEE MMM d'}}
                    </h5>
                </div>
            </div>
        </div>
    </body>

【问题讨论】：

= 是赋值，== 和 === 是比较运算符。
@elclanrs 进行了更改，第一个 div 或第二个 div 中没有任何显示。
我相信today日期不能小于过去的任何其他日期。

标签： javascript angularjs angularjs-scope

【解决方案1】：

由于Date 是字符串，today 是 Date 对象，因此您需要将它们都转换为相同的类型才能正确比较。我会使用date filter 将today 格式化为与Date 相同的字符串：

app.controller("boardController", function($scope, $filter) {
    $scope.today = $filter('date')(new Date(), 'yyyy-MM-dd');
    // ...
});

然后在 HTML 中你会得到（注意 === 比较运算符）

ng-if="post.Date === today"

【讨论】：

太棒了！这完全符合我的想法。如果您不介意我问，您将如何让第二个 div 显示日期早于今天但不早于一周？
post.Date > today 应该也适用于我发布的内容。
但是您将如何设置例如$scope.yesterday？我正在尝试$scope.yesterday = $filter('date')(new Date().setDate($scope.today.getDate() - 1), 'yyyy-MM-dd');，但这似乎不起作用。
您需要有一个日期对象才能获取日期。查看我为此创建的演示：plnkr.co/edit/9vJjYUTuIKZmvGjgnqRf?p=preview
太棒了。非常感谢。