Custom Pipes in Angular 4
In this Angular 4 Tutorial i will show you how to generate and create custom pipes in Angular using the CLI by creating a custom sort pipe example.
Angular 4 QuickStart Tutorial Playlist
• Playlist
Angular 4 Pipes Example
• Angular 4 Pipes Tutorial with Examples
In Angular 4 you can create your own pipes as well as using the built-in ones.
Create your first Angular pipe
Run below command from the cmd while inside the working project folder. 'replace nameOfPipe with your pipe name'
ng g pipe nameOfPipe
By running above command the CLI will generate all the files while adding all required code.
app.component.ts
countries = ['Poland', ,'Nepal', 'Egypt', 'USA','India', 'Argentina']
sort.pipe.ts
I added the colored code:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'sort'
})
export class SortPipe implements PipeTransform {
transform(value: any, args?: any): any {
return value.sort() ;
}}
app.component.html
{{countries | sort}}
Auf dieser Seite können Sie das Online-Video Angular 4 Tutorial: Create Custom Pipes Using CLI Example mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer DotsWay 06 Juni 2017 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 3,123 Mal angesehen und es wurde von 17 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!