angular generate pipe code example
Example 1: angular create custom pipe
// Create a custom pipe
// First run the command:
ng g pipe pipes/yourPipeName
// Then import and declare on your module
import { YourPipeNamePipe } from '../../pipes/your-pipe-name.pipe';
@NgModule({
imports: [
...
],
declarations: [ YourPipeNamePipe ]
})
// On your-pipe-name.pipe.ts
@Pipe({
name: 'yourPipe'
})
...
transform(value: any, ...args: any[]): any {
return "converted test message";
}
// On your xxx.component.html
{{"test" | yourPipe}} // prints "converted test message"
Example 2: command to create custom pipe in angular 6
ng generate pipe personName
Example 3: create class angular
// to create a model class, we first need to create a new file
//f.e person.ts
export class Person {
constructor(
public name: string,
public lastName: string,
public age:number
) {}
}
//now that we have the model class we can create arrays that contain Person class elements
.
.
public people: Person[];
constructor(){
this.people = [
new Person ('Carla','Smith', 20 ),
new Person ('Carlos','Smith', 25 ),
new Person ('Andrea','Johnson', 23 ),
];
}