CODEWITHSUNDEEP
angularangularjs-directiveangular-servicesdate-pipe
Chen Dachao
Chen Dachao

Reputation: 1836

How to use angular2 built-in date pipe in services and directives script files

I want to use angular2's date pipe in services and directives script files(not only in HTML).

Does anyone have any ideas?

Can't upload code cos some policy restrictions, sorry about that.

Upvotes: 51

Views: 77419

Answers (2)

Avnesh Shakya
Avnesh Shakya

Reputation: 3906

In your component

import { DatePipe } from '@angular/common';

If you are using Angular 2, 4 version, try

new DatePipe().transform(myDate, 'yyyy-dd-MM');

If you are using Angular 6 and above

new DatePipe('en-US').transform(myDate, 'yyyy-dd-MM');

Hope this will help.

Upvotes: 35

Alexander Leonov
Alexander Leonov

Reputation: 4794

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());
}

Upvotes: 105

Related Questions