diff --git a/src/components/virtual-scroll/test/basic/app.module.ts b/src/components/virtual-scroll/test/basic/app.module.ts index 951fa08e9e2..70ddf47daef 100644 --- a/src/components/virtual-scroll/test/basic/app.module.ts +++ b/src/components/virtual-scroll/test/basic/app.module.ts @@ -58,6 +58,10 @@ export class E2EPage { window.location.reload(true); } + trackByFn(index: number, item: any) { + return item.value; + } + } diff --git a/src/components/virtual-scroll/test/basic/main.html b/src/components/virtual-scroll/test/basic/main.html index 9fb5e0c6df5..352d64427ac 100644 --- a/src/components/virtual-scroll/test/basic/main.html +++ b/src/components/virtual-scroll/test/basic/main.html @@ -19,15 +19,16 @@ - + + - Header: {{header}} + Header: {{ header }} - Item: {{item.value}} {{item.someMethod()}} + Item: {{ item.value }} {{ item.someMethod() }} diff --git a/src/components/virtual-scroll/virtual-scroll.ts b/src/components/virtual-scroll/virtual-scroll.ts index d64e1365bb9..ed09f654c8e 100644 --- a/src/components/virtual-scroll/virtual-scroll.ts +++ b/src/components/virtual-scroll/virtual-scroll.ts @@ -234,6 +234,7 @@ export class VirtualScroll implements DoCheck, AfterContentInit, OnDestroy { }; _queue: number = SCROLL_QUEUE_NO_CHANGES; _recordSize: number = 0; + _virtualTrackBy: TrackByFn; @ContentChild(VirtualItem) _itmTmp: VirtualItem; @ContentChild(VirtualHeader) _hdrTmp: VirtualHeader; @@ -249,9 +250,7 @@ export class VirtualScroll implements DoCheck, AfterContentInit, OnDestroy { @Input() set virtualScroll(val: any) { this._records = val; - if (isBlank(this._differ) && isPresent(val)) { - this._differ = this._iterableDiffers.find(val).create(this.virtualTrackBy); - } + this._updateDiffer(); } /** @@ -368,7 +367,12 @@ export class VirtualScroll implements DoCheck, AfterContentInit, OnDestroy { /** * @input {function} Same as `ngForTrackBy` which can be used on `ngFor`. */ - @Input() virtualTrackBy: TrackByFn; + @Input() + set virtualTrackBy(val: TrackByFn) { + if (!isPresent(val)) return; + this._virtualTrackBy = val; + this._updateDiffer(); + }; constructor( @@ -481,6 +485,12 @@ export class VirtualScroll implements DoCheck, AfterContentInit, OnDestroy { return null; } + private _updateDiffer(): void { + if (isBlank(this._differ) && isPresent(this._records)) { + this._differ = this._iterableDiffers.find(this._records).create(this.virtualTrackBy); + } + } + /** * @hidden * DOM WRITE @@ -632,7 +642,7 @@ export class VirtualScroll implements DoCheck, AfterContentInit, OnDestroy { var stopAtHeight = (data.scrollTop + data.renderHeight); processRecords(stopAtHeight, records, cells, - this._hdrFn, this._ftrFn, data); + this._hdrFn, this._ftrFn, data); } // ******** DOM READ ****************