Як відформатувати дату в angularjs

Я хочу відформатувати дату як mm/dd/yyyy. Я спробував наступне, і жодне з них не працює на мене. Хтось може мені допомогти у цьому?

довідка: ui-дата

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

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

Angular.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.

Вихід: 15.12.2014

Редагувати
Якщо ви використовуєте строкову дату формату рядка "2014-12-19 20:00:00" (передається з бекенда PHP), то вам слід змінити код на такий: https://stackoverflow.com / а / 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

Я використовую це, і це працює чудово.

{{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

Це насправді не саме те, що ви просите, але ви можете спробувати створити поле для введення дати в HTML щось на кшталт:

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

Потім для друку цього на сторінці, яку ви б використали:

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

Нарешті, у своєму контролері я оголосив метод, який створює дату із вхідного значення (який у хромі, мабуть, розбирається за 1 вихідний день):

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

Так ось у вас це є. Щоб побачити все, що працює, дивіться наступний планк: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview. Найкращі удачі!

Це спрацює:

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

ПРИМІТКА: як тільки ви заміните ці, то залишилася дата / мільйон буде перетворена на задану рамку.

див. кутові dateapi: AngularJS API: дата

Використання:

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

Іспит:

Код:

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

Результат:

10/29/2010

Я використовую фільтр

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

тоді

{{'2018-05-06 09:04:13' | toDate | date:'dd/MM/yyyy hh:mm'}}

Просто переведіть формат дати UTC з боку вашого сервера на сторону клієнта

і використовувати нижче синтаксис -

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

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

Переглянувши всі вищезазначені рішення, наступне було для мене найшвидшим рішенням. Якщо ви використовуєте кутовий матеріал:

 <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-datepicker у кутовому матеріалі )

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

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>

Результат виглядатиме так: - * 29.10.2010 * 01.03.2013

Гаразд, проблема, здається, виходить із цього рядка:
https://github.com/angular-ui/ui-date/blob/master/src/date.js#L106 .

Насправді ця лінія є прив'язкою до інтерфейсу jQuery, який має бути місцем для введення формату даних.

Як ви бачите var opts, немає властивості dateFormatзі значенням у форматі ng-date, як можна було б визначити.

У будь-якому випадку в директиві є константа, яка вимагається 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"
    };
});

Рішення з твердим кодом:

Якщо ви не хочете повторювати цю процедуру, постійно змінюйте значення uiDateConfigв date.js на:

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

У мене була та сама проблема, і, як зазначено вище, я вважав, що в JavaScript повинен бути власний метод. Річ у тому, що new Date(valueofdate)повертає об'єкт Date.

Але перевірте http://www.w3schools.com/js/js_date_formats.asp , частину, яка говорить про нуль. Дата з рядка, наприклад відлуння від PHP, має бути таким:

$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 можуть бути змінені відповідно до параметрів, залишок параметрів може бути однаковим

{{convertToDate  | date :  dateformat}}                                             
$rootScope.dateFormat = 'MM/dd/yyyy';

// $scope.dateField="value" in ctrl
<div ng-bind="dateField | date:'MM/dd/yyyy'"></div>