怎样用 angularjs 格式化日期

我想格式化日期为 mm/dd/yyyy。我尝试了以下方法,没有一个适合我。 有人能帮我吗?

参考资料: 日期

<input ui-date ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />


<input type="date" ng-model="valueofdate" />
566326 次浏览

这并不是你真正想要的-但是你可以尝试在 html 中创建一个日期输入字段,比如:

<input type="date" ng-model="myDate" />

然后把这个打印在页面上,你会用到:

<span ng-bind="convertToDate(myDate) | date:'medium'"></span>

最后,在我的控制器中,我声明了一个从输入值创建一个日期的方法(在 chrome 中,显然解析了1天) :

$scope.convertToDate = function (stringDate){
var dateOut = new Date(stringDate);
dateOut.setDate(dateOut.getDate() + 1);
return dateOut;
};

因此,你有它。要看到整个事情的工作看到下面的活塞: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview。祝你好运!

Js 有一个内置的日期过滤器。

小样

// in your controller:
$scope.date = '20140313T00:00:00';


// in your view, date property, filtered with date filter and format 'MM/dd/yyyy'
<p ng-bind="date | date:'MM/dd/yyyy'"></p>


// produces
03/13/2014

您可以看到支持的日期格式 在数据过滤器的源中

编辑 :

如果您试图在数据采集器中获得正确的格式(不清楚是使用数据采集器还是仅仅尝试使用它的格式化程序) ,那么这里支持的格式字符串是: https://api.jqueryui.com/datepicker/

如果您没有输入字段,而只是想显示具有适当格式的字符串日期,那么您可以简单地选择:

<label ng-bind="formatDate(date) |  date:'MM/dd/yyyy'"></label>

在 js 文件中使用:

    // @Function
// Description  : Triggered while displaying expiry date
$scope.formatDate = function(date){
var dateOut = new Date(date);
return dateOut;
};

这将把字符串中的日期转换为 javascript 中的新日期对象,并以 MM/dd/yyyy 格式显示日期。

产出: 12/15/2014

剪辑
如果您使用的字符串日期格式为“2014-12-1920:00:00”字符串格式(从 PHP 后端传递) ,那么您应该将代码修改为: https://stackoverflow.com/a/27616348/1904479中的格式

进一步补充
通过 javascript,可以将代码设置为:

$scope.eqpCustFields[i].Value = $filter('date')(new Date(dateValue),'yyyy-MM-dd');

如果你已经有一个日期,否则你可以使用下面的代码来得到当前的系统日期:

$scope.eqpCustFields[i].Value = $filter('date')(new Date(),'yyyy-MM-dd');

有关日期格式的详细信息,请参阅: https://docs.angularjs.org/api/ng/filter/date

这将奏效:

\{\{ oD.OrderDate.replace('/Date(','').replace(')/','') | date:"MM/dd/yyyy" }}

注意: 一旦你替换了这些,那么剩余的日期/毫升将被转换为给定的格式。

好的,问题似乎来自这句话:
Https://github.com/angular-ui/ui-date/blob/master/src/date.js#l106.

实际上这一行是与 jQueryUI 的绑定,它应该是注入数据格式的地方。

正如您可以在 var opts中看到的那样,没有具有 ng-date-format 值的属性 dateFormat

无论如何,该指令有一个称为 uiDateConfig的常量,用于向 opts添加属性。

灵活的解决方案(推荐) :

给你可以看到,可以在指令中插入一些选项,用 jquery ui 选项注入一个控制器变量。

<input ui-date="dateOptions" ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />


myAppModule.controller('MyController', function($scope) {
$scope.dateOptions = {
dateFormat: "dd-M-yy"
};
});

硬编码解决方案:

如果您不想一直重复这个过程,请将 date.js 中的 uiDateConfig值更改为:

.constant('uiDateConfig', { dateFormat: "dd-M-yy" })

请参见角 date API: < a href = “ https://docs.AngularJS.org/API/ng/filter/date”rel = “ noReferrer”> AngularJS API: date


Angular-date滤波器: < br >

用法:

\{\{ date_expression | date  [: 'format']  [: 'timezone' ] }}


例如: < br/>

密码:

 <span>\{\{ '1288323623006' | date:'MM/dd/yyyy' }}</span>

结果:

10/29/2010

在看了以上所有的解决方案之后,下面是对我来说最快的解决方案。如果你正在使用角材料:

 <md-datepicker ng-model="member.reg_date" md-placeholder="Enter date"></md-datepicker>

设置格式:

app.config(function($mdDateLocaleProvider) {
$mdDateLocaleProvider.formatDate = function(date) {
// Requires Moment.js OR enter your own formatting code here....
return moment(date).format('DD-MM-YYYY');
};
});

编辑: 您还需要设置 parseDate 来输入日期(从这个答案 改变角形材料中 md 数据采集器的格式开始)

$mdDateLocaleProvider.parseDate = function(dateString) {
var m = moment(dateString, 'DD/MM/YYYY', true);
return m.isValid() ? m.toDate() : new Date(NaN);
};

我正在使用这个,它工作得很好。

\{\{1288323623006 | date:'medium'}}: Oct 29, 2010 9:10:23 AM
\{\{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}}: 2010-10-29 09:10:23 +0530
\{\{1288323623006 | date:'MM/dd/yyyy @ h:mma'}}: 10/29/2010 @ 9:10AM
\{\{1288323623006 | date:"MM/dd/yyyy 'at' h:mma"}}: 10/29/2010 at 9:10AM

我有同样的问题和上面的评论,认为必须有一个本地方法在 JavaScript 中。问题是 new Date(valueofdate)返回一个 Date 对象。

但是,检查 http://www.w3schools.com/js/js_date_formats.asp,前导零的部分。来自 String 的日期,例如来自 PHP 的 echo,必须类似于:

$valueofdate = date('Y-n-j',strtotime('theStringFromQuery'));

这将传递一个 String,例如: '1999-3-3'和 JavaScript 将对格式正确的对象进行解析

$scope.valueofdate = new Date(valueofdate);


<input ui-date ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />
<input type="date" ng-model="valueofdate" />

日期格式链接到 PHP: http://www.w3schools.com/php/func_date_date_format.asp

ng-bind="reviewData.dateValue.replace('/Date(','').replace(')/','') | date:'MM/dd/yyyy'"

使用这个应该可以很好地工作。 :) ReviewData 和 dateValue 字段可以根据参数 rest 的不同进行更改

// $scope.dateField="value" in ctrl
<div ng-bind="dateField | date:'MM/dd/yyyy'"></div>
var app=angular.module('myApp',[]);
app.controller('myController',function($scope){
$scope.names = ['1288323623006','1388323623006'];


});

这里控制器的名称是“ myController”,应用程序的名称是“ myApp”。

<div ng-app="myApp" ng-controller="myController">
<ul>
<li ng-repeat="x in names">
\{\{x | date:'mm-dd-yyyy'}}


</li>


</ul>
</div>

结果会是这样的:- * 10-29-2010 * 01-03-2013

只需将 UTC 日期格式从服务器端代码传递到客户端

并使用下面的语法-

 \{\{dateUTCField  +'Z' | date : 'mm/dd/yyyy'}}


e.g. dateUTCField = '2018-01-09T10:02:32.273' then it display like 01/09/2018

我用 过滤器

.filter('toDate', function() {
return function(items) {
return new Date(items);
};
});

那么

\{\{'2018-05-06 09:04:13' | toDate | date:'dd/MM/yyyy hh:mm'}}
\{\{convertToDate  | date :  dateformat}}
$rootScope.dateFormat = 'MM/dd/yyyy';