Questions tagged [angular-pipe]

Use for discussion of Angular 2+ pipes

An Angular pipe takes in data as input and transforms it to a desired output.

The first version of AngularJS, used the concept of filters to format the value of an expression for display to the user.

Angular (version 2 and on) introduced a similar concept, now called pipe.

671 questions
7
votes
5 answers

Is there a way to inject pipes in HTML dynamically? Angular 9

The subject I'm building an abstract table component to which I pass what pipe it should use in certain columns. As the data passed may vary, so the pipes should vary as well. The goal To use whatever pipe is passed to the table The project Here's…
big_OS
  • 381
  • 7
  • 20
7
votes
5 answers

Displaying a number in Indian format using angular 2

I want to print numbers with commas as thousands, lacs, crores separators. for e.g: 10,000 - ten thousand 1,00,000 - 1 lakh 10,00,000 - 10 lakh 1,00,00,000 - 1 crore I have used angular's number pipe to implement comma separated values…
lakhan
  • 255
  • 7
  • 14
7
votes
2 answers

Angular 6 pipe does not support constructor

This is my date-formatter-by-timezone.pipe.ts pipe import { Pipe, PipeTransform } from '@angular/core'; import { CookieService } from 'ngx-cookie-service'; @Pipe({ name: 'dateFormatterSecByTimezone' }) export class DateFormatterSecByTimezonePipe…
Abdol Seed
  • 1,227
  • 1
  • 14
  • 23
7
votes
2 answers

Angular 4 null call when loading image

In my angular 4 application I have to load a thumbnail, So I have img [src] tag. To append the authorization token at the request to load this image I use a custom image pipe and an async pipe. It works good but if I see in the network tab I can see…
Alessandro Celeghin
  • 4,039
  • 14
  • 49
  • 95
7
votes
1 answer

Angular 2 pipe triggering

I have a collection of models. In template I use pipe
In each component I have a timer for update data. But when…
Illorian
  • 1,222
  • 2
  • 13
  • 38
7
votes
1 answer

Angular2 Pipe can't find the name

I made a Pipe as follow: import {Pipe, PipeTransform} from '@angular/core'; import { Radio } from '../../models/radio'; @Pipe({ name: 'radioFilter' }) export class radioFilterPipe implements PipeTransform { transform(value: Radio[], args:…
Frenchi In LA
  • 3,139
  • 3
  • 25
  • 41
6
votes
3 answers

Why custom pipe is giving Error: Property 'transform' in type 'EllipsisPipe' is not assignable to the same property in base type 'SlicePipe'

I've created a custom pipe with the help of someone else's answer on stackoverflow. If article.title is larger than 55 characters then it should get trimmed after 55 characters and three dots should be there like a tail. For e.g: How to make a…
Tanzeel
  • 4,174
  • 13
  • 57
  • 110
6
votes
1 answer

Angular Json Pipe TypeError: Converting circular structure to JSON

I have been trying to follow along with an angular course and came across the following error while using ngform: core.js:6237 ERROR TypeError: Converting circular structure to JSON --> starting at object with constructor 'TView' | …
Prashant
  • 91
  • 1
  • 9
6
votes
4 answers

How to use currency pipe to get values upto 2 decimal digits in component?

I have a values like 54781.7622000 , 1123.11. I want this values in a format like $54781.76 , $1123.11. //import currency pipe import { CurrencyPipe } from '@angular/common' //initialize in constructor constructor(private cp:…
swapnil jain
  • 252
  • 1
  • 3
  • 22
6
votes
3 answers

Angular 6 library pipe

How to add a custom pipe in an Angular 6 library in order for it to be available in my main app ? Currently I'm doing this in: lib.module.ts: @NgModule({ declarations: [ SomePipe ], exports: [ SomePipe ]}) in public_api.ts: export *…
6
votes
1 answer

Angular - pass pipe as variable

How may I store and use pipe information from variables? I've already searched a lot but couldn't find a solution for that. What I'm trying to achieve is passing any valid pipe information as a variable (decimal, percent, date, custom, etc). Follows…
GCSDC
  • 3,138
  • 3
  • 28
  • 48
6
votes
0 answers

Angular 6 - Custom pipes in shared module not being exported

My Angular architecture is composed of 3 modules. AppModule (where the app prensetation and logic resides) CoreModule (Contains my services to access API) SharedModule (Contains my models, pipes, directives, etc...) I want to add a new pipe in my…
Eastrall
  • 7,609
  • 1
  • 16
  • 30
6
votes
2 answers

Angular - Impure pipe vs function

I am implementing a filtering operation on an array in Angular2. A pure pipe is not triggering when an element change in the array. Thus, I have to use either an impure pipe or make the filtering with a function inside of the component like…
6
votes
2 answers

async pipe with a method call in angular 4 calls infinitely

I need to provide select UI element with dynamic options for which I have a method that returns an observable based on the Inputs TypeScript (Component class) getCars(type : string, engine : string) : Observable{ return…
Mahi Tej Gvp
  • 984
  • 1
  • 14
  • 34
6
votes
2 answers

Promise in Pipe transform

I don't want to use "| async pipe" because I don't want to get data for every component. My transform function below: transform(key: string, ...args) { this.storage.get("dictionary").then((dict) => { var translated = dict[key] ||…
Berk Akkerman
  • 483
  • 1
  • 3
  • 12