Stack Overflow
Stack Overflow

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
31
votes
4 answers

Angular 4 Pipe Filter

I am trying to use a custom pipe to filter my *ngFor loop using an input field with ngModel. With my other custom pipe (sortBy), it works perfectly fine. However, the filter pipe seems to make it that none of the data appears. I'm still learning…
user3523602
  • 362
  • 1
  • 3
  • 12
31
votes
3 answers

Manually trigger pipe update

I have created a pipe to be able to use *ngFor with objects. However, when the object is updated, the pipe does not update. I have found a solution here by using stateful pipe with pure: false. This solution is not acceptable in terms of…
Nate
  • 7,606
  • 23
  • 72
  • 124
26
votes
1 answer

Disable the default keyvalue pipe sort in angular

{{item.value}} I am just trying to print the items in the regular order but the key/value pipe does a default sorting based on the…
Abdul K Shahid
  • 504
  • 1
  • 4
  • 17
24
votes
4 answers

Angular2 use basic pipe in custom pipe

I'd like to add some additional functionality to the basic angular2 pipes. ie. some extra formatting done on the currency pipe. To do that I'd like to use the existing pipe in the component code of my custom pipe. Is there any way this can be…
Rutger van Baren
  • 7,964
  • 2
  • 24
  • 24
22
votes
3 answers

How to use DecimalPipe from component in angular?

I have a requirement that I have to convert the number using the decimal pipe from ts Instead of use decimal pipe like this {{rmanFmvRulesDef.max | number :'1.2-2'}} I want to manipulate it from the component, can anyone please help me?
Soumya Gangamwar
  • 954
  • 4
  • 16
  • 44
22
votes
5 answers

Angular: limitTo pipe not working

I am trying to run limitTo pipe on Angular2 on a string: {{ item.description | limitTo : 20 }} And I get the following error: The pipe 'limitTo' could not be found Is it possible that this pipe was removed in Angular2? This is my…
Yuvals
  • 3,094
  • 5
  • 32
  • 60
20
votes
4 answers

Display number in Million or Thousand format in angular 4

I am trying to display number format in my angular 4 application. Basically what i am looking at is if the number is in 12.23 millions then it should display For e.g 12.2M (One decimal place) If the number is 50,000.123 then 50.1K How do i achieve…
Tom
  • 8,175
  • 41
  • 136
  • 267
20
votes
8 answers

Removing Comma from number pipe in angular2

I am a beginner in Angular 2.I'm trying to display some data using angular. this is my code part: Value : {{myvalue| number : '1.2-2'}} Above part will display Value as for eg: "124,500.00". Its ok but i need to remove…
Jithin j
  • 272
  • 1
  • 3
  • 13
18
votes
1 answer

Angular 2.0 Release: Pipes and Directives are not properties of @Component anymore

I just upgraded my app which I built on RC5 to the final release, and I'm confused of the way I should be declaring Directives and Pipes now. I'm getting this error: ERROR in [default]…
Motassem Kassab
  • 1,744
  • 4
  • 21
  • 40
17
votes
7 answers

The specified value cannot be parsed, or is out of range when using number pipe

The specified value cannot be parsed, or is out of range When I get my object I format a number with a pipe but it returns this warning and the value isn't displayed. If I remove it, it is displayed. This doesn't displays the value
leri
  • 261
  • 1
  • 3
  • 12
17
votes
2 answers

Pass multiple values to pipe in Angular 6

I need to create a search form in Angular 6 with pipe and must pass multiple arguments to pipe . nameSearch , emailSearch ,roleSeach , accountSearch and this my pipe : @Pipe({ name:…
Mr-Programer
  • 541
  • 3
  • 8
  • 21
14
votes
5 answers

async pipe sends 'null' value to the child component

I want to pass a value to the child component. this value is an Observable, so I use async pipe. test$ is just a normal observable variable, that emits values after a period of time (3000 ms), simulating an…
Sh eldeeb
  • 1,589
  • 3
  • 18
  • 41
13
votes
4 answers

Is there any angular date ago pipe?

I'm trying to create post sharing web site. I want to create date ago pipe in angular. import {Pipe, PipeTransform} from 'angular2/core'; @Pipe({ name: 'messageTime', pure: false }) export class MessageTimePipe implements PipeTransform { …
Jihar Steew
  • 141
  • 1
  • 1
  • 6
13
votes
4 answers

How to hide currency symbol in angular currency pipe

I'm trying to use Angular currency pipe and I wanted to remove the currency symbol all together from the formatted number, but it seems there is no option to do that. So is there any easy way to achieve this without writing a custom pipe for it?
Sinandro
  • 2,426
  • 3
  • 21
  • 36
13
votes
3 answers

How to access form control and form group in angular reactive form

I would like to pipe a form group of a reactive form. Then I would like to do some checks on this group separate controls. Here is how I define my form myForm = this.formBuilder.group({ myFormNameDrop: this.formBuilder.group({ …
codebot
  • 517
  • 8
  • 29
  • 55
1
2
3
…
44 45