angularjs時刻解析格式

Question

我有一個NG-重複該顯示以下表達式

{{date}} // 2-1-2017 

當我使用角力矩

{{date | amDateFormat:'DD'}} 

我得到1，其我期待2.如何使片刻知道我的格式實際上是dd-mm-yyyy而不是mm-dd-yyy在視圖中？我不想在我的控制器級解析它，因爲它很複雜。

Answer 1

根據該文檔，AngularJs有一個內置的filter for date可以與下面的一組中：

{{ date_expression | date : format : timezone}} 

所以，你可以使用它像：

{{ date | date:'dd-MM-yyyy'}} 

不過，如果你使用時刻的日期過濾器，它必須是時間日期（即，具有時區定義的完整日期）對象，並且您可以使用與角度相同的方式對其進行過濾。

{{ date | amDateFormat:'dd-MM-yyyy' }} 

Answer 2

您應該使用角度濾波，如：

{{date | date:'dd-MM-yyyy'}} 

Answer 3

我認爲你的問題可能會在你如何建立你的約會對象

new Date("2-1-2017") ; // Wed Feb 01 2017 

如果我這樣做，1有關指的是當天，這是正確的。 日期篩選器基於它接收的對象解​​析日期，您應該爲輸入日期查找正確的日期格式。

Answer 4

可以使用角度內置filter for date（在其他的答案建議），如果輸入的是：

• 一個JavaScript Date對象
• 一個數字，表示毫秒（這也可以是一個字符串）
• 在ISO 8601格式的字符串（例如yyyy-MM-ddTHH:mm:ss.sssZ，yyyy-MM-dd等）

---

您的date是一個格式爲而不是 ISO 8601的字符串，因此您必須將您將2-1-2017解析爲日期的方式進行更改。

您可以分析你的字符串使用moment(String, String)您的控制器顯示在下面的例子：

angular.module('MyApp',['angularMoment']) 
 
.controller('AppCtrl', function($scope) { 
 
    $scope.dates = [ 
 
    // Wrong way to parse string 
 
    moment('2-1-2017').toDate(), 
 
    // Parse string specifying format 
 
    moment('2-1-2017', 'D-M-YYYY').toDate() 
 
    ]; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/1.0.1/angular-moment.min.js"></script> 
 

 
<div ng-app="MyApp" ng-controller="AppCtrl"> 
 
    <div ng-repeat="date in dates"> 
 
    <span>angular-moment: {{date | amDateFormat:'DD'}}</span> 
 
    <span>angular date filter: {{date | date:"dd"}}</span> 
 
    </div> 
 
</div>

如果你不想修改你的控制器，你可以用角動量amParse過濾。正如文檔所述，此篩選器：

將自定義格式的日期解析爲可用於am-time-ago指令和其他過濾器的時刻對象。

所以你的情況，你可以使用下面的示例所示的代碼：

angular.module('MyApp',['angularMoment']) 
 
.controller('AppCtrl', function($scope) { 
 
    $scope.dates = [ 
 
    '2-1-2017', // February 2 2017 
 
    '15-1-2017' // January 15 2017 
 
    ]; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/1.0.1/angular-moment.min.js"></script> 
 

 
<div ng-app="MyApp" ng-controller="AppCtrl"> 
 
    <div ng-repeat="date in dates"> 
 
    <span>angular-moment: {{date | amParse:'D-M-YYYY' | amDateFormat:'DD'}}</span> 
 
    </div> 
 
</div>