Questions tagged [angular2-pipe]

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

An Angular 2 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 2 introduced a similar concept, now called pipe.

187 questions
5
votes
1 answer

How can I write an Angular ngFor pipe to filter array of objects by object property?

I have 2 selects. One for Leagues and one for Divisions I want to create a Pipe that will filter Divisions depending on what League is selected. Giving the data below. If I select Random Beer League only TwoFour and SixPack should show up as options…
locnguyen
  • 841
  • 1
  • 12
  • 25
5
votes
1 answer

Angular 2: Cursor issue with "number" pipe on ngModel input

I have an input that I want to be displayed like currency. I want only two decimal places to be allowed and for it to only allow numbers while automatically adding commas when necessary. Basically, if the user types "12345", I want the input to…
Bryan
  • 2,951
  • 11
  • 59
  • 101
5
votes
1 answer

Difference between Angular Filters and Angular2 Pipes?

Could somebody explain me conceptual difference between Angular Filters and Angular2 Pipes? They are built for the same purpose, no? Is there any difference under hood?
{{user.created | dateFormat }}
Even the syntax is quite the same.
Stepan Suvorov
  • 25,118
  • 26
  • 108
  • 176
5
votes
3 answers

Angular 2 Pipe not found

I followed this link to create my own time ago pipe: Angular 2 "time ago" pipe but when I injected and used it, I saw the error: Template parse errors: The pipe 'timeAgo' could not be found Below is my code, please help me to resolve this issue,…
user3027246
  • 233
  • 6
  • 13
4
votes
2 answers

How to load JSON from a pipe?

I have a service that's loading a JSON file and using that service in a custom pipe: import { Pipe, PipeTransform } from '@angular/core'; import { Observable } from 'rxjs/Rx'; import { LanguageLoadService } from…
Slyke
  • 124
  • 1
  • 12
4
votes
2 answers

Angular2 filtering checkboxes

I have an Angular2 grid that contains an array of Fabrics. These Fabrics have properties such as color or fabric Type. Right now the grid has them all displaying. I need to some how have a series of checkboxes for the color and fabric type with the…
4
votes
2 answers

Pipes Angular 2 dynamic Array Length

Is it posible to dynamically show length of array by using pipe? Here's my code: import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'lengthOfArray' }) export class LengthOfArrayPipe implements PipeTransform { transform(value:…
Mistu
  • 145
  • 2
  • 13
4
votes
0 answers

Using pipe name as a variable in the template in Angular2

I am struggling with using a standard angular2 pipe in a non-standard way and I was wondering if there are any ways around it. Assume I have a variable which its value equals the definition of a standard pipe, for example, the common "date:'medium'"…
Behrooz
  • 1,895
  • 4
  • 31
  • 47
4
votes
2 answers

How to downgrade custom pipe written with angular2 to be used in angular 1.5?

I wrote component that is using a pipe in angular 2. Now I am trying to downgrade the component to be used in my angular 1.5: angular.module('myApp') .directive('Item', downgradeComponent({component: ItemComponent, inputs: ['item'], outputs:…
4
votes
2 answers

Angular 2 pipe change on button click for table rows

Is it possible to change/put pipe to format a specific column in Angular 2 on button click? Like for example I have a table with 'Name' and 'Hours' columns, when I click a button the data displayed for 'Hours' should be converted into days and…
xird
  • 775
  • 1
  • 8
  • 16
4
votes
1 answer

Input box with pipe does not update value when space is removed

I have created a pipe to format the value in the input box as follows: 1 123 10 123 101 123 2 101 123 23 101 123 123 101 123 The pipe gives the desired output when I type into the input box or hit backspace. Issue: The input box does not update…
JSNinja
  • 705
  • 6
  • 19
4
votes
2 answers

Unable to get JSON Object value using angular2 pipe

I am creating a dynamic table using Angular2. I have created an angular2 component with 2 pipes: 1st pipe gets the key from the JSON object which is used as the column for the table (working perfectly), whereas 2nd pipe must get the value from JSON…
balajivaishnav
  • 2,795
  • 4
  • 23
  • 38
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

ng2-translate - Translation strings not updating in Components with OnPush change detection

When I first change the language of my application the translation service makes a request for the file that represents the new language, My 'smart' components strings reflect the update correctly BUT any 'pure/dumb' components do not, they stay in…
HomeBrew
  • 849
  • 2
  • 12
  • 25
4
votes
1 answer

Angular2 RC1 Pipes Always Passing Undefined

After upgrading to RC1 from Beta, pipes don't seem to be correctly passing data. I am receiving the following: ORIGINAL EXCEPTION: TypeError: Cannot read property '1' of undefined ORIGINAL STACKTRACE: TypeError: Cannot read property '1' of…
raeker
  • 67
  • 8
1 2
3
12 13