如何更改日期格式angularjs 1.x

Question

如何在angularjs中將1-Jan-2018更改爲1-1-2018。

使用HTML模板結合樣

{{ date_expression | date : format : timezone}}

Answer 1

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

 
//app.directive('appDirective', function() {}); 
 
//app.factory('appService', function() {}); 
 

 
function AppCtrl($scope) { 
 
    $scope.date_expression = '1-Jan-2018'; 
 
} 
 

 
app.filter('DateFormat',function(){ 
 
return function(inputDate, format) { 
 
\t var date= new Date(inputDate); 
 
\t var addZero=function(number){ 
 
\t \t if(number<10){ 
 
\t \t \t return "0"+number; 
 
\t \t } 
 
\t \t else{ 
 
\t \t \t return number; 
 
\t \t } 
 
\t } 
 
\t var month=addZero(date.getMonth()+1); 
 
\t format=format.replace("mm",month); 
 
\t var day=addZero(date.getDate()); 
 
\t format=format.replace("dd",day); 
 
\t var year=date.getFullYear(); 
 
\t format=format.replace("yyyy",year); 
 
\t return format; 
 
} 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <div ng-controller="AppCtrl"> 
 
    <span> 
 
     {{ date_expression | DateFormat:'dd-mm-yyyy'}} 
 
    </span> 
 
    </div> 
 
</div>

Answer 2

如果我理解正確，這將幫助你

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

 
//app.directive('appDirective', function() {}); 
 
//app.factory('appService', function() {}); 
 

 
function AppCtrl($scope) { 
 
    $scope.date_expression = '1-Jan-2018'; 
 
} 
 

 
app.filter('myFilter', function() { 
 

 
    // In the return function, we must pass in a single parameter which will be the data we will work on. 
 
    // We have the ability to support multiple other parameters that can be passed into the filter optionally 
 
    return function(input) { 
 

 
    var output = input.split('-'); 
 
    var monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; 
 
    // Do filter work here 
 
    output[1] = monthNames.indexOf(output[1]) + 1 
 
    return output.join('-'); 
 

 
    } 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <div ng-controller="AppCtrl"> 
 
    <span> 
 
     {{ date_expression | myFilter}} 
 
    </span> 
 
    </div> 
 
</div>

Answer 3

//add this filter 
app.filter('datetime', function ($filter) { 
    return function (input) { 
     if (input == null) { return ""; } 
     var _date = $filter('date')(new Date(input), 'dd/MM/yyyy'); //You can pass here any date Format whatever you required 
     return _date.toUpperCase(); 
    }; 
}); 

//html 
<span>{{yourModelValueOfDate | datetime}}</span>