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';
@Component({
selector: 'dateTime'
})
@View({
templateUrl: 'dates.html'
})
// date controller
class Dates {
date: Date;
//date constructor
constructor() {
}
}
bootstrap(Dates);
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>
<html>
<head>
<script src="https://jspm.io/system@0.18.17.js"></script>
<script src="https://code.angularjs.org/2.0.0-alpha.37/angular2.min.js"></script>
<script>
System.config({
paths: {
'main.js': 'main.js'
}
});
System.import('main.js');
</script>
</head>
<body>
<datetime></datetime>
</body>
</html>
Output
: http://embed.plnkr.co/mzLXt7/preview
|
Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
|
