Cách định dạng ngày trong angularjs

Tôi muốn định dạng ngày là mm/dd/yyyy. Tôi đã thử những điều sau đây và không ai trong số đó làm việc cho tôi. Bất cứ ai có thể giúp tôi với điều này?

tham khảo: ngày

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

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

Angular.js có bộ lọc ngày tích hợp.

bản giới thiệu

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

Bạn có thể thấy các định dạng ngày được hỗ trợ trong nguồn cho bộ lọc ngày .

chỉnh sửa :

Nếu bạn đang cố gắng để có được định dạng chính xác trong datepicker (không rõ là bạn đang sử dụng datepicker hay chỉ đang cố gắng sử dụng định dạng của nó), các chuỗi định dạng được hỗ trợ này có tại đây: https://api.jqueryui.com/datepicker/

Nếu bạn không có trường đầu vào, thay vì chỉ muốn hiển thị ngày chuỗi với định dạng phù hợp, bạn có thể chỉ cần đi:

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

và trong tập tin js sử dụng:

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

Điều này sẽ chuyển đổi ngày trong chuỗi thành một đối tượng ngày mới trong javascript và sẽ hiển thị ngày ở định dạng MM / dd / yyyy.

Đầu ra: 15/12/2014

Chỉnh sửa
Nếu bạn đang sử dụng định dạng chuỗi ngày định dạng chuỗi "2014-12-19 20:00:00" (được truyền từ phụ trợ PHP), thì bạn nên sửa đổi mã thành một trong: https://stackoverflow.com / a / 27616348/190847

Thêm vào
từ javascript, bạn có thể đặt mã là:

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

đó là trong trường hợp bạn đã có một ngày với bạn, nếu không bạn có thể sử dụng mã sau đây để có được ngày hệ thống hiện tại:

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

Để biết thêm chi tiết về Định dạng ngày, hãy tham khảo: https://docs.angularjs.org/api/ng/filter/date

Tôi đang sử dụng nó và nó đang hoạt động tốt.

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

Đây không thực sự chính xác là những gì bạn đang yêu cầu - nhưng bạn có thể thử tạo trường nhập ngày trong html như:

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

Sau đó, để in này trên trang bạn sẽ sử dụng:

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

Cuối cùng, trong bộ điều khiển của tôi, tôi đã khai báo một phương thức tạo ngày từ giá trị đầu vào (trong chrome rõ ràng được phân tích cú pháp 1 ngày):

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

Vì vậy, có bạn có nó. Để xem toàn bộ hoạt động, hãy xem plunker sau: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview. Chúc may mắn!

Điều này sẽ làm việc:

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

LƯU Ý: một khi bạn thay thế những ngày này / ngày còn lại sẽ được chuyển đổi thành foramt đã cho.

xem dateapi góc : API AngularJS: ngày

Sử dụng:

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

Exampe:

Mã số:

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

Kết quả:

10/29/2010

Tôi sử dụng bộ lọc

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

sau đó

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

Chỉ cần chuyển định dạng ngày UTC từ mã phía máy chủ của bạn sang phía máy khách

và sử dụng cú pháp dưới đây -

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

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

Sau khi xem xét tất cả các giải pháp trên, sau đây là giải pháp nhanh nhất cho tôi. Nếu bạn đang sử dụng vật liệu góc cạnh:

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

Để đặt định dạng:

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

Chỉnh sửa: Bạn cũng cần đặt parseDate để nhập ngày (từ câu trả lời này Thay đổi định dạng của md-datepicker trong Vật liệu góc )

$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'];

        });

Ở đây tên Trình điều khiển là "myContoder" và tên ứng dụng là "myApp".

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

            </li>

        </ul>
    </div>

Kết quả sẽ như thế này: - * 10-29-2010 * 01-03-2013

Ok vấn đề có vẻ như đến từ dòng này:
https://github.com/angular-ui/ui-date/blob/master/src/date.js#L106 .

Trên thực tế, dòng này là ràng buộc với Giao diện người dùng jQuery, đây là nơi để định dạng dữ liệu.

Như bạn có thể thấy trong var optsđó không có thuộc tính nào có dateFormatgiá trị từ định dạng ng-date như bạn có thể can thiệp.

Dù sao, lệnh này có một hằng số được gọi uiDateConfigđể thêm thuộc tính vào opts.

Giải pháp linh hoạt (được khuyến nghị):

Từ đây bạn có thể thấy bạn có thể chèn một số tùy chọn tiêm vào chỉ thị một biến điều khiển với các tùy chọn 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"
    };
});

Giải pháp mã hóa cứng:

Nếu bạn không muốn lặp lại quy trình này mọi lúc, hãy thay đổi giá trị của uiDateConfigdate.js thành:

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

Tôi đã có cùng một vấn đề và như các ý kiến ​​trên, nghĩ rằng phải có một phương thức riêng trong JavaScript. Điều này lànew Date(valueofdate) trả về một đối tượng Date.

Nhưng, hãy kiểm tra trong http://www.w3schools.com/js/js_date_formats.asp , phần nói số 0 đứng đầu. Một ngày từ Chuỗi, ví dụ như tiếng vang từ PHP, phải như sau:

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

Điều này sẽ vượt qua một Chuỗi, ví dụ: '1999-3-3'và JavaScript sẽ thực hiện phân tích cú pháp đến một đối tượng có định dạng đúng với

$scope.valueofdate = new Date(valueofdate);

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

Liên kết với PHP cho các định dạng ngày: http://www.w3schools.com/php/func_date_date_format.asp .

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

Sử dụng này nên hoạt động tốt. :) Các trường reviewData và dateValue có thể thay đổi vì phần còn lại của tham số của bạn có thể được giữ nguyên

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

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