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

Making one digit number as two digit using Angular Pipes

I wanted to make 1 look as 01 on html and similarly 11 as 11. Can anyone please help me if there are such filters. Here is a sample demo code
User985614
  • 330
  • 1
  • 5
  • 18
4
votes
2 answers

How to concat a string after using slice pipe

I'm new to Angular. I want to cut short strings that are longer than 15 characters (say) and then add ... at the end. For eg: Name: Tanzeel, Role: Intern Address: Bangal..., Likes: C, CPP, ..., I'm using p-chips from PrimeNg to display some tags.…
Tanzeel
  • 4,174
  • 13
  • 57
  • 110
4
votes
2 answers

Showing Title string/templateRef Angular

I am trying to improve my code rather than having conditions, so I decided to create a directive or maybe a pipe if possible that could help me print the title of a tab depending on its type (string or templateRef), my code is the following, this…
Youness Houdass
  • 204
  • 4
  • 15
4
votes
3 answers

Force change detection in pipe (pure or impure) bound to ngModel

I'm binding an ngModel value to the angular percent pipe, updating on ngModelChange with updateOn set to blur. It works well except when entering the same value again. When entering the same value again, the pipe does not detect the change and the…
verynear
  • 41
  • 4
4
votes
1 answer

How to properly import the pipe in ionic 4 and angular 7?

I have generated my custom 'completedOn' pipe with ionic CLI: ionic g pipe completedOn and it automatically generated two files. First is completed-on.pipe.ts import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name:…
Ante Ereš
  • 623
  • 4
  • 8
  • 24
4
votes
1 answer

angular - declare result of pipe as local variable

I'm using ngx-pipe's percentage pipe twice in a label. Once to determine which color class (success or info) and once to display the percentage.
4
votes
2 answers

Why is slice an impure pipe?

I've always believed that slice is pure and it's sole advantage over calling slice method on string or array is caching mechanism of pure pipes in Angular. Turns out it isn't the case and slice is impure. Moreover implementation is very basic: it…
Tomasz Błachut
  • 2,368
  • 1
  • 16
  • 23
4
votes
2 answers

Using async pipe looses reference to object type

I have a simple problem. When I'm using async pipe in template IDE don't know what type has the object from the async pipe. Here is a short example: Actually foo is of type Foo: {id:string,…
Maciej Wojcik
  • 2,115
  • 2
  • 28
  • 47
4
votes
1 answer

Need angular 2+ currency pipe to show 2 decimals and accept various user input

I have an input that I need to display currency in. I need it to always show 2 decimal places and no dollar symbol. I decided to use the number pipe since I was not concerned about the dollar symbol. This input is editable by the user but when I…
Moose
  • 1,270
  • 2
  • 19
  • 33
4
votes
0 answers

Format number input with Angular

In Angular, how would I format the displayed input's value without changing my model value? The value must be displayed with thousand separator (' ' for FR, and ',' for EN) and with decimal separator (',' for FR and '.' for EN). The input must be…
lifeinzik
  • 41
  • 4
4
votes
5 answers

Block Round Off using decimal pipe in angular 4

Using angular 4, {{31.94 | number:'1.0-0'}} Output: 32 Any idea, how to block the round off. Expecting the result is 31
Sudip Pal
  • 2,041
  • 1
  • 13
  • 16
4
votes
1 answer

Angular 2 - How to use build-in pipe inside custom pipe

I want to make a custom currency pipe using the built-in currency pipe. The way I want to use is {{ anyNumber | customCurrency }}. Then inside my customCurrency pipe, I want to use built-in currency pipe. I can decide the parameters to currency pipe…
Vijay Malik
  • 107
  • 1
  • 1
  • 10
4
votes
1 answer

How do I make a pipe dynamic angular2

I have the following UI buttons: [Show All] [Category 1] [Category 2] I would like to use filterBy from ngx-pipes (https://github.com/danrevah/ngx-pipes) to filter my data. Usage: array | filterBy: [prop, nested.prop, ...]: search: [strict |…
Moshe
  • 2,583
  • 4
  • 27
  • 70
4
votes
1 answer

Angular2 + async pipe: Get multiple values from a single Observale

I have a single Service, which returns a single Observable. Now I'm looking for the correct / most efficient way to get multiple results from this Observable without writing too much code. MyService returns an Observable> MyComponent…
Benjamin M
  • 23,599
  • 32
  • 121
  • 201
4
votes
1 answer

Dynamically updating [checked] in Angular2

componentA.ts: @Input() array; componentB.ts: @Component({ selector: 'app-component-b', templateUrl: './app.component-b.html' }) export class…
7ball
  • 2,183
  • 4
  • 26
  • 61
1 2 3
…
44 45