Формат Дата-Время в 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

910   13  

13 ответов:

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

см.http://jsfiddle.net/southerd/xG2t8/

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

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

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

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

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

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

{{dt | date:dateFormat }}

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

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

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');

Это даст вам сегодняшнюю дату в формате, который вы хотите.

здесь фильтр это займет строку даты или объект javascript Date (). Он использует момент.js и может применяться любой момент.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 минут назад

Если вам нужно вызвать несколько функций moment, вы можете связать их. Это преобразует в 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>7/4/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 4: 31:20 PM" затем перейдите к простому шагу

Шаг 1- Объявите следующую переменную в JS controller

$scope.current_time = new Date();

step2- отображение в html-странице, как

{{current_time / date: 'medium'}}

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

{{dt / date : "dd-MM-yyyy"}}

можно использовать 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 "";
    };
});

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

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

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

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

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

Comments

    Ничего не найдено.