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

@Pipe({
  name: 'pagerPipe'
})
export class PagerPipe implements PipeTransform {

  transform(array: any[], pager: Pager): any {
    var start = (pager.activePage-1)*pager.pageSize;
    var end = pager.activePage*pager.pageSize;
    console.log(start,end);
    return array.slice(start,end);
  }

};
//--------------------------------------------------------------------------
export class Pager {
  pageSize:number;
  activePage:number;
};

It works just fine when I set the arguments to have individual pageSize and activePage, But when I pass a class that has both pageSize and pageNumber, the pipe doesnt detect argument changes

Unfortunately Im using angular-cli via ng build and "plunker" wont let me upload vendor.bundle.js saying "save failed"

http://www.mediafire.com/file/2ndirjwkhgq06gq/Test.zip unzip and run index.html

By the way, Id like to avoid using Impure pipes.

anaval
  • 1,130
  • 10
  • 24
  • 1
    Have you tried triggering change detection manually? – eko May 06 '17 at 17:49
  • @echonax not yet, how do I do that? Btw arent pipes suppose to trigger everytime an input/argument changes? – anaval May 06 '17 at 17:53
  • 1
    If you don't change the object reference, I think it would be hard for Angular to tell that there's a change. http://stackoverflow.com/questions/34827334/triggering-angular2-change-detection-manually – eko May 06 '17 at 17:54
  • Try and create an immutable pager and see if it helps. – Avi May 06 '17 at 18:22
  • @Avi how do I do that? Also, is it possible for my pager class to detect changes on its properties? – anaval May 06 '17 at 18:30
  • you can create a function that accepts pager object and return new pager object (the function will create new pager with the new props) and return the new instance. call it whenever one of the props changes, instead of set value to the prop set new object. If I am not clear I will add a post with some code.... – Avi May 09 '17 at 10:46

0 Answers0