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의 기본 구현에서는이를 날짜로 인식하지 않습니다. 새로운 날짜를 사용하여 강제로 할 수는 있지만 배열에 약간의 고통이 있습니다. 필터를 함께 파이프 할 수 있으므로 필터를 사용하여 입력을 날짜로 변환 한 다음 변환 된 날짜에 날짜 : 필터를 적용 할 수 있습니다. 다음과 같이 새 사용자 정의 필터를 작성하십시오.
app
.filter("asDate", function () {
return function (input) {
return new Date(input);
}
});
그런 다음 마크 업에서 필터를 함께 파이프 할 수 있습니다.
{{item.myDateTimeString | asDate | date:'shortDate'}}
다음과 같이 'date'필터를 얻을 수 있습니다.
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' }}
표시 할 분 전
여러 모멘트 함수를 호출해야하는 경우이를 연결할 수 있습니다. 이것은 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();
2 단계와 같은 html 페이지에 표시
{{current_time | 날짜 : '중간'}}
우리는 각도에서 볼 때 날짜 형식을 지정하는 것이 매우 쉽습니다 .... 아래 예를 확인하십시오.
{{dt | date : "dd-MM-yyyy"}}
You can use momentjs
to implement date-time filter in angularjs. For example:
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 "";
};
});
Where date is in time stamp format.
Add $filter
dependency in controller.
var formatted_datetime = $filter('date')(variable_Containing_time,'yyyy-MM-dd HH:mm:ss Z')
I would suggest you to use moment.js it has got a good support for date formatting according to locales.
create a filter that internally uses moment.js method for formatting date.
참고URL : https://stackoverflow.com/questions/12920892/format-date-time-in-angularjs
'development' 카테고리의 다른 글
div에서 모든 자식 DOM 요소를 제거하십시오. (0) | 2020.07.11 |
---|---|
URL 쿼리 매개 변수 목록으로 객체를 직렬화하는 방법은 무엇입니까? (0) | 2020.07.11 |
알파에 새 APK 업로드-실패 (0) | 2020.07.11 |
jQuery onclick 이벤트를 동적으로 추가 된 HTML 요소에 바인딩하는 방법 (0) | 2020.07.11 |
경계가있는 UITextView (0) | 2020.07.11 |