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의 기본 구현에서는 날짜로 인식하지 않습니다. new Date를 사용하여 강제 할 수 있지만 배열에 약간의 고통이 있습니다. 필터를 함께 파이프 할 수 있으므로 필터를 사용하여 입력을 날짜로 변환 한 다음 변환 된 날짜에 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');

원하는 형식으로 오늘 날짜를 제공합니다.

다음은 날짜 문자열 또는 javascript Date () 객체를 사용 하는 필터 입니다. Moment.js를 사용 하며 인기있는 'fromNow'와 같은 모든 Moment.js 변환 기능을 적용 할 수 있습니다.

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

2014 년 11 월 11 일 표시

{{ 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> 2014 년 7 월 4 일

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

<div>{{myDate | date:'M/d/yyyy HH:mm:ss'}}</div> 2014 년 7 월 4 일 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');

간단히 "Jan 30, 2017 4:31:20 PM"과 같이 출력하려면 간단한 단계를 따르십시오.

1 단계-js 컨트롤러에서 다음 변수 선언

$scope.current_time = new Date();

step2- 같은 html 페이지에 표시

{{현재 _ 시간 | 날짜 : 'medium'}}

보기 쪽의 날짜를 각도로 포맷하는 것은 매우 쉽습니다 .... 아래 예를 확인하십시오.

{{dt | 날짜 : "dd-MM-yyyy"}}

momentjsangularjs에서 날짜-시간 필터를 구현 하는 데 사용할 수 있습니다 . 예를 들면 :

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 메서드를 사용하는 필터를 만듭니다.