Формат даты и времени в AngularJS

Как правильно отображать дату и время в AngularJS?

В выходных данных ниже показаны входные и выходные данные с фильтром даты AngularJS и без него:

In: {{v.Dt}}  
AngularJS: {{v.Dt | date:'yyyy-MM-dd HH:mm:ss Z'}}

Это печатает:

In: 2012-10-16T17:57:28.556094Z 
AngularJS: 2012-10-16T17:57:28.556094Z

Желаемый формат отображения - 2010-10-28 23:40:23 0400или2010-10-28 23:40:23 EST

v.Dt, скорее всего, не является объектом Date ().

См. Http://jsfiddle.net/southerd/xG2t8/

но в вашем контроллере:

scope.v.Dt = Date.parse(scope.v.Dt);

Ваш код должен работать так, как вы видите эту скрипку .

Вы должны убедиться, что у вас v.Dtправильный объект Date, чтобы он работал.

{{dt | date:'yyyy-MM-dd HH:mm:ss Z'}}

или если dateFormat определен в области видимости как dateFormat = 'yyyy-MM-dd HH: mm: ss Z':

{{dt | date:dateFormat }}

Я знаю, что это старый предмет, но подумал, что стоит рассмотреть другой вариант.

Поскольку исходная строка не включает разграничитель «T», реализация по умолчанию в Angular не распознает его как дату. Вы можете принудительно использовать новую дату, но это немного неудобно для массива. Поскольку вы можете объединить фильтры вместе, вы можете использовать фильтр для преобразования введенных вами данных в дату, а затем применить фильтр date: к преобразованной дате. Создайте новый настраиваемый фильтр следующим образом:

app
.filter("asDate", function () {
    return function (input) {
        return new Date(input);
    }
});

Затем в разметке вы можете соединить фильтры вместе:

{{item.myDateTimeString | asDate | date:'shortDate'}}

вы можете получить фильтр «дата» следующим образом:

var today = $filter('date')(new Date(),'yyyy-MM-dd HH:mm:ss Z');

Это даст вам сегодняшнюю дату в желаемом формате.

Вот фильтр, который будет принимать строку даты ИЛИ объект Date () javascript. Он использует Moment.js и может применять любую функцию преобразования Moment.js , например популярную 'fromNow'.

angular.module('myModule').filter('moment', function () {
  return function (input, momentFn /*, param1, param2, ...param n */) {
    var args = Array.prototype.slice.call(arguments, 2),
        momentObj = moment(input);
    return momentObj[momentFn].apply(momentObj, args);
  };
});

Так...

{{ anyDateObjectOrString | moment: 'format': 'MMM DD, YYYY' }}

отобразит 11 ноября 2014 г.

{{ anyDateObjectOrString | moment: 'fromNow' }}

будет отображаться 10 минут назад

Если вам нужно вызвать несколько мгновенных функций, вы можете связать их. Это преобразуется в UTC, а затем форматирует ...

{{ someDate | moment: 'utc' | moment: 'format': 'MMM DD, YYYY' }}

https://gist.github.com/cmmartin/341b017194bac09ffa1a

Вот несколько популярных примеров:

<div>{{myDate | date:'M/d/yyyy'}}</div> 7/4/2014

<div>{{myDate | date:'yyyy-MM-dd'}}</div> 2014-07-04

<div>{{myDate | date:'M/d/yyyy HH:mm:ss'}}</div> 04.07.2014 12:01:59

Вы видели раздел документации « Написание директив (короткая версия) » ?

HTML

<div ng-controller="Ctrl2">
      Date format: <input ng-model="format"> <hr/>
      Current time is: <span my-current-time="format"></span>
</div> 

JS

function Ctrl2($scope) {
  $scope.format = 'M/d/yy h:mm:ss a';
}

Внутри контроллера формат можно отфильтровать, введя $ filter.

var date = $filter('date')(new Date(),'MMM dd, yyyy');

Если вы хотите вывести что-то вроде «30 января 2017 г., 16:31:20», следуйте простому шагу.

step1 - объявить следующую переменную в контроллере js

$scope.current_time = new Date();

step2 - отображение на html-странице, например

{{current_time | дата: 'средний'}}

мы можем отформатировать дату на стороне просмотра в угловом формате, это очень просто ... проверьте пример ниже:

{{dt | date: "дд-ММ-гггг"}}

Вы можете использовать momentjsдля реализации фильтра даты и времени в angularjs. Например:

angular.module('myApp')
 .filter('formatDateTime', function ($filter) {
    return function (date, format) {
        if (date) {
            return moment(Number(date)).format(format || "DD/MM/YYYY h:mm A");
        }
        else
            return "";
    };
});

Где дата в формате отметки времени.

Добавить $filterзависимость в контроллер.

var formatted_datetime = $filter('date')(variable_Containing_time,'yyyy-MM-dd HH:mm:ss Z')

Я бы посоветовал вам использовать moment.js, у него хорошая поддержка форматирования даты в соответствии с местными стандартами.

создать фильтр, который внутренне использует метод moment.js для форматирования даты.