diff --git a/packages/angular/src/lib/cdk/list-view/list-view.component.ts b/packages/angular/src/lib/cdk/list-view/list-view.component.ts index a78eb92..e36398d 100644 --- a/packages/angular/src/lib/cdk/list-view/list-view.component.ts +++ b/packages/angular/src/lib/cdk/list-view/list-view.component.ts @@ -1,4 +1,4 @@ -import { AfterContentInit, ChangeDetectionStrategy, Component, ContentChild, Directive, DoCheck, ElementRef, EmbeddedViewRef, EventEmitter, Host, HostListener, Input, IterableDiffer, IterableDiffers, NgZone, OnDestroy, Output, TemplateRef, ViewChild, ViewContainerRef, ɵisListLikeIterable as isListLikeIterable, ɵmarkDirty } from '@angular/core'; +import { AfterContentInit, ChangeDetectionStrategy, Component, ContentChild, Directive, DoCheck, ElementRef, EmbeddedViewRef, EventEmitter, forwardRef, Host, HostListener, Inject, InjectionToken, Input, IterableDiffer, IterableDiffers, NgZone, OnDestroy, Output, TemplateRef, ViewChild, ViewContainerRef, ɵisListLikeIterable as isListLikeIterable, ɵmarkDirty } from '@angular/core'; import { ItemEventData, KeyedTemplate, LayoutBase, ListView, ObservableArray, profile, View } from '@nativescript/core'; import { extractSingleViewRecursive } from '../../element-registry/registry'; @@ -7,6 +7,12 @@ import { NgViewTemplate } from '../../view-refs'; const NG_VIEW = '_ngViewRef'; +export interface TemplatedItemsHost { + registerTemplate(key: string, template: TemplateRef); +} + +export const TEMPLATED_ITEMS_COMPONENT = new InjectionToken('TemplatedItemsComponent'); + export class ItemContext { constructor(public $implicit?: T, public item?: T, public index?: number, public even?: boolean, public odd?: boolean) {} } @@ -83,8 +89,9 @@ export interface SetupItemViewArgs { `, changeDetection: ChangeDetectionStrategy.OnPush, + providers: [{ provide: TEMPLATED_ITEMS_COMPONENT, useExisting: forwardRef(() => ListViewComponent) }], }) -export class ListViewComponent implements DoCheck, OnDestroy, AfterContentInit { +export class ListViewComponent implements DoCheck, OnDestroy, AfterContentInit, TemplatedItemsHost { public get nativeElement(): ListView { return this.templatedItemsView; } @@ -180,7 +187,10 @@ export class ListViewComponent implements DoCheck, OnDestroy, AfterCont this._templateMap = new Map>(); } - this._templateMap.set(key, new NsTemplatedItem(template, this.loader, (v) => this._viewToTemplate.set(v, key))); + this._templateMap.set( + key, + new NsTemplatedItem(template, this.loader, (v) => this._viewToTemplate.set(v, key)) + ); } @HostListener('itemLoading', ['$event']) @@ -263,7 +273,7 @@ export function getItemViewRoot(viewRef: EmbeddedViewRef, rootLocator: // eslint-disable-next-line @angular-eslint/directive-selector @Directive({ selector: '[nsTemplateKey],[nsTemplateKeys]' }) export class TemplateKeyDirective { - constructor(private templateRef: TemplateRef, @Host() private comp: ListViewComponent) {} + constructor(private templateRef: TemplateRef, @Host() @Inject(TEMPLATED_ITEMS_COMPONENT) private comp: TemplatedItemsHost) {} @Input() set nsTemplateKey(value: string) {