diff --git a/nativescript-angular/directives/list-view-comp.ts b/nativescript-angular/directives/list-view-comp.ts index 8915976d7..ff131b306 100644 --- a/nativescript-angular/directives/list-view-comp.ts +++ b/nativescript-angular/directives/list-view-comp.ts @@ -12,7 +12,9 @@ import { ChangeDetectorRef, EventEmitter, ViewChild, - Output} from '@angular/core'; + Output, + ChangeDetectionStrategy} from '@angular/core'; +import {isBlank} from '@angular/core/src/facade/lang'; import {isListLikeIterable} from '@angular/core/src/facade/collection'; import {Observable as RxObservable} from 'rxjs' import {ListView} from 'ui/list-view'; @@ -45,7 +47,8 @@ export interface SetupItemViewArgs { `, - inputs: ['items'] + inputs: ['items'], + changeDetection: ChangeDetectionStrategy.OnPush }) export class ListViewComponent { public get nativeElement(): ListView { @@ -97,6 +100,10 @@ export class ListViewComponent { if (args.view) { console.log("ListView.onItemLoading: " + index + " - Reusing existing view"); viewRef = args.view[NG_VIEW]; + // getting angular view from original element (in cases when ProxyViewContainer is used NativeScript internally wraps it in a StackLayout) + if (!viewRef) { + viewRef = (args.view._subViews && args.view._subViews.length > 0) ? args.view._subViews[0][NG_VIEW] : undefined; + } } else { console.log("ListView.onItemLoading: " + index + " - Creating view from template"); @@ -108,6 +115,9 @@ export class ListViewComponent { } public setupViewRef(viewRef: EmbeddedViewRef, data: any, index: number): void { + if (isBlank(viewRef)) { + return; + } const context = viewRef.context; context.$implicit = data; context.item = data; diff --git a/ng-sample/app/examples/list/list-test.ts b/ng-sample/app/examples/list/list-test.ts index 16c920717..1b9e669cc 100644 --- a/ng-sample/app/examples/list/list-test.ts +++ b/ng-sample/app/examples/list/list-test.ts @@ -6,35 +6,32 @@ class DataItem { constructor(public id: number, public name: string) { } } -// @Component({ -// selector: 'item-component', -// template: ` -// -// -// -// -// ` -// }) -// export class ItemComponent { -// @Input() data: DataItem; -// @Input() odd: boolean; -// @Input() even: boolean; -// constructor() { } -// } +@Component({ + selector: 'item-component', + template: ` + + + + + ` +}) +export class ItemComponent { + @Input() data: DataItem; + @Input() odd: boolean; + @Input() even: boolean; + constructor() { } +} @Component({ selector: 'list-test', - //directives: [ItemComponent], + directives: [ItemComponent], template: ` @@ -47,12 +44,12 @@ class DataItem { `, changeDetection: ChangeDetectionStrategy.OnPush // TEMPLATE WITH COMPONENT - //