python ruby-programming-language Smalltalk Vue.js Knockoutjs TypeScript JavaScript, OOPs JavaScript Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 4 Angular 2 AngularJs 1.x NodeJs Perl Programming R Programming RequireJs Rust Programming Backbonejs closure programming language go-programming-language kotlin-programming-language
Angular 2 date format

Angular 2 date format

Hello everyone, I am going to share the code sample of date format using ES6 and Angular 2. The example in detail as given below.

ES6 code-sample

import {Component, View, bootstrap} from 'angular2/angular2';

    selector: 'dateTime'

    templateUrl: 'dates.html'

    // date controller
class Dates {
     date: Date;

    //date constructor
    constructor() { = new Date();

Dates HTML Template

<!-- dates.html -->
<h1>Date Time</h1>
<p>{{date | date:'dd MM yyyy'}}</p>
<p>{{date | date:'dd MM yyyy hh:mm'}}</p>
<p>{{date | date:'dd MM yyyy hh:mm:ss'}}</p>
<p>{{date | date:'MM dd yy'}}</p>
<p>{{date | date:'MM dd yyyy'}}</p>
<p>{{date | date:'mediumDate'}}</p>
<p>{{date | date:'yMMMMd'}}</p>
<p>{{date | date:'shortTime'}}</p>

AngularJs, HTML with ES6 example code

<!DOCTYPE html>
    <script src="[email protected]"></script>
    <script src=""></script>
            paths: {
                'main.js': 'main.js'


Hi there! Welcome to my blog. My name is Anil Singh. I'm a author of this blog. For more detail about me, kindly refer to this link..
My Blogs - and
My Books - Interview Questions and Answers Books- Get Your Book in 15+ Digital Stores Worldwide..

You Might Also Like Powered by Blogger.
ASK Questions