Question

我有一个使用Bootstrap＆amp; amp;的小型网络应用程序。 AngularJS显示通过JSON api请求远程接收的表数据。使用ng-repeat生成表。列中包含上次更新名称＆＃39; last_seen＆＃39;的日期。我想要突出显示此字段距离当前日期超过1小时的行。

在此处或网上搜索示例最常建议使用Date（）对象或AngularJS＆＃39; date＆＃39;过滤。基于这些，我设法通过以下代码获得了预期的结果：

    <script type="text/javascript">
    var dataApp = angular.module('dataApp', []);
    dataApp.controller('dataShow', function($scope, $http, $filter) {
        $http.get('api.php').success(function(data) {
            $scope.Data = data;
        })
        $scope.DangerDate = new Date() - 1000*60*60; // now - 1 hour
        $scope.dangerDate = $filter('date')($scope.DangerDate, 'yyyy-MM-dd HH:mm:ss');
    });
</script>

＆＃39;

    <div ng-app="dataApp" ng-controller="dataShow" class="panel-body">
        <div class="panel panel-default">
            <table class="table table-striped table-hover" id="output">
                <thead>
                    <tr>
                        <th class="{{header}}" ng-repeat="(header, value) in Data[0]"></i></th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="row in Data" ng-class="{ danger: row.last_seen <= dangerDate }">
                        <td ng-repeat="cell in row">{{cell}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

但是这些示例并没有直接在HTML模板中比较日期，就像我对row.last_seen <= dangerDate所做的那样。

我也不喜欢我过去常常约会的方式 - 1小时＆＃39;使用JS - 创建Date（）对象，从中减去秒数，然后使用$ filter将其转换为文本值。

可以做那些事情还是有更好的方法？

Answer 1

你的proplem不是有角度的，但得到日期比较工作在JavaScript中。下面的代码将有助于理解这样的事情是如何运作的。

var d1 = new Date();
var d2 = new Date(d1);

console.log(d1 == d2);   // prints false (wrong!) 
console.log(d1 === d2);  // prints false (wrong!)
console.log(d1 != d2);   // prints true  (wrong!)
console.log(d1 !== d2);  // prints true  (wrong!)
console.log(d1.getTime() === d2.getTime()); // prints true (correct)

来自此帖子的@moonshadow的积分 - ＆gt;。来源：Compare two dates with JavaScript

将您的日期转换为新日期（）;您可以在

中比较它们的对象

ng-class="{ danger: row.last_seen_withdateobject.getTime() <= dangerDate.getTime() }"

您的代码看起来像这样。暗示逻辑。（根据我的理解）你想要显示突出显示的帖子，比我们大1小时或更长。我会做什么

单独为每一行预设;

row.last_seen2 = new Date() - 1000*60*60;
$scope.now = new Date();

ng-class="{ danger: row.last_seen2.getTime() - now.getTime() }"

看看我创建的这个小小提琴，用于展示您的需求，并通过小时和分钟来了解它的工作原理。 https://jsfiddle.net/xykqxmpy/6/

使用AngularJS ng-repeat

1 个答案: