Answers for "how to use datepipe in angular"

24

date pipe angular

//how to use
//example: {{ yourDate | date:'short'}}

'short': equivalent to 'M/d/yy, h:mm a' (6/15/15, 9:03 AM).
'medium': equivalent to 'MMM d, y, h:mm:ss a' (Jun 15, 2015, 9:03:01 AM).
'long': equivalent to 'MMMM d, y, h:mm:ss a z' (June 15, 2015 at 9:03:01 AM GMT+1).
'full': equivalent to 'EEEE, MMMM d, y, h:mm:ss a zzzz' (Monday, June 15, 2015 at 9:03:01 AM GMT+01:00).
'shortDate': equivalent to 'M/d/yy' (6/15/15).
'mediumDate': equivalent to 'MMM d, y' (Jun 15, 2015).
'longDate': equivalent to 'MMMM d, y' (June 15, 2015).
'fullDate': equivalent to 'EEEE, MMMM d, y' (Monday, June 15, 2015).
'shortTime': equivalent to 'h:mm a' (9:03 AM).
'mediumTime': equivalent to 'h:mm:ss a' (9:03:01 AM).
'longTime': equivalent to 'h:mm:ss a z' (9:03:01 AM GMT+1).
'fullTime': equivalent to 'h:mm:ss a zzzz' (9:03:01 AM GMT+01:00).
Posted by: Guest on December-28-2020
0

how to use datepipe in ts file

// Since CommonModule does not export it as a provider you'll have to do it yourself. This is not very complicated.

//1) Import DatePipe:

import { DatePipe } from '@angular/common';
// 2) Include DatePipe in your module's providers:

NgModule({
  providers: [DatePipe]
})
export class AppModule {
}
// or component's providers:

@Component({
  selector: 'home',
  styleUrls: ['./home.component.css'],
  templateUrl: './home.component.html',
  providers: [DatePipe]
})
export class HomeComponent {
...
// 3) Inject it into your component's constructor like any other service:

constructor(private datePipe: DatePipe) {
}
// 4) Use it:

ngOnInit() {
    this.time = this.datePipe.transform(new Date());
}
Posted by: Guest on August-24-2021

Code answers related to "Javascript"

Browse Popular Code Answers by Language