Angular 6 Custom Pipe | with Parameterizing a pipe | Angular Pure pipes + Impure pipes

angular

65

angular6

9

loveprogramming viết ngày 24/04/2021

https://grokonez.com/frontend/angular/angular-6/angular-6-custom-pipe-with-parameterizing-a-pipe-angular-pure-pipes-impure-pipes

Angular 6 Custom Pipe | with Parameterizing a pipe | Angular Pure pipes + Impure pipes

In the tutorial, we show how to create an Angular Custom Pipe with Angular Pure Pipe, and Angular Impure Pipe.

Related posts:

• Angular Built-in DatePipe Example | Pre-defined Format + Timezone + Locale + Custom Format
• Angular 6 – KeyValue Pipe – *ngFor Loop through Object, Map example – How to Integrate Bootstrap with Angular (Angular 6) – Angular 6 Component – How to create & integrate New Angular 6 Component – Angular NgFor Repeater Directive – Loop over a Collection (Angular 6)

Related pages:

• Angular Tutorial

Custom Pipe

We can write our own custom pipes.

Example: create a pipe that calculates a logarithm of a number with the base value.
->

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({name: 'logbase'})
export class Logarithm  implements PipeTransform {
    transform(value: number, base: number): string {
        return (Math.log(value) / Math.log(base)).toPrecision(2);
    }
}

• The @Pipe decorator allows you to define the pipe name that you'll use within template expressions.
• PipeTransform interface's transform method that accepts an input value followed by optional parameters and returns the transformed value. ->

https://grokonez.com/frontend/angular/angular-6/angular-6-custom-pipe-with-parameterizing-a-pipe-angular-pure-pipes-impure-pipes

Angular 6 Custom Pipe | with Parameterizing a pipe | Angular Pure pipes + Impure pipes