【问题标题】:Sorting and formatting dates angular排序和格式化日期角度
【发布时间】:2015-09-13 23:33:50
【问题描述】:

我有一些使用角度和数据表显示的数据。现在我希望这些数据按日期排序。我的代码如下所示。

<table dataTable="ng"
       class="table table-striped table-bordered hover"
       dt-options="dtOptions">
    <thead>
    <tr >
        <th>Date/Time</th>
        <th>Created By</th>
      ...
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="x in items | orderBy : 'timestamp' : true">
        <td>{{x.timestamp | date: 'medium'}}</td>
        <td>{{x.user.firstname}} {{x.user.lastname}}</td>
    ...
    </tr>
    </tbody>
</table>

但是,我似乎只能格式化日期或对其进行排序,但不能同时进行。如果我删除它排序的格式,否则它不会。

有人知道我做错了什么吗?

【问题讨论】:

    标签: angularjs


    【解决方案1】:

    运行没有问题(运行 sn-p ...)。

    这是你想做的吗?

    注意,我删除了 table 指令并用 ng-controller 替换了它,也许这会导致你的问题?

    angular.module('myApp', []);
    
    angular
      .module('myApp')
      .controller('myTable', MyTable)
    
    function MyTable($scope){
        $scope.items = [
          {
            timestamp : 1442188000000,
            user: {
              firstname : 'George'
            }  
          },
          
          {
            timestamp : 1442189022149,
            user: {
              firstname : 'John'
            }  
          },
          {
            timestamp : 1442199022149,
            user: {
              firstname : 'David'
            }  
          }
        ]  
    }  
    	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    
    
    <table ng-app="myApp" ng-controller="myTable">
        <thead>
        <tr >
            <th>Date/Time</th>
            <th>Created By</th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="x in items | orderBy : 'timestamp' : true">
            <td>{{x.timestamp | date: 'medium'}}</td>
            <td>{{x.user.firstname}} {{x.user.lastname}}</td>
        </tr>
        </tbody>
    </table>

    【讨论】:

    • 看来问题出在我的时间戳格式上。它是一个日期类型。它从 c# DatetimeOffset 序列化。也许这就是问题所在,因为它无法正确排序。
    • 时间戳格式如下:timestamp: "2015-09-11T00:00:00+10:00"
    猜你喜欢
    • 2017-04-12
    • 2011-09-22
    • 1970-01-01
    • 2022-11-25
    • 1970-01-01
    • 1970-01-01
    • 2018-12-31
    • 2021-05-08
    • 1970-01-01
    相关资源
    最近更新 更多