fix(picker): listview item template handling for angular

NathanWalker · NathanWalker · commit c4a66e08b537 · 2021-10-07T14:37:57.000-07:00
diff --git a/packages/picker/angular/picker.directive.ts b/packages/picker/angular/picker.directive.ts
@@ -1,45 +1,64 @@
-import { ChangeDetectionStrategy, Component, ElementRef, forwardRef, IterableDiffers, AfterContentInit, OnDestroy, NgZone } from '@angular/core';
-import { PickerField } from '@nativescript/picker';
-import { PickerValueAccessor } from './picker.accessors';
-import { View } from '@nativescript/core';
+// import { ChangeDetectionStrategy, Component, ElementRef, forwardRef, IterableDiffers, AfterContentInit, OnDestroy, NgZone } from '@angular/core';
+// import { PickerField } from '@nativescript/picker';
+// import { PickerValueAccessor } from './picker.accessors';
+// import { EventData, View } from '@nativescript/core';
 
-@Component({
-	selector: 'PickerField',
-	template: ` <DetachedContainer>
-		<Placeholder #loader></Placeholder>
-	</DetachedContainer>`,
-	changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class PickerFieldComponent implements AfterContentInit {
-	private _className: string;
+// @Component({
+// 	selector: 'PickerField',
+// 	template: ` <DetachedContainer>
+// 		<Placeholder #loader></Placeholder>
+// 	</DetachedContainer>`,
+// 	changeDetection: ChangeDetectionStrategy.OnPush,
+// })
+// export class PickerFieldComponent implements AfterContentInit {
+// 	private _className: string;
 
-	public get nativeElement(): PickerField {
-		return this.templatedItemsView;
-	}
+// 	public get nativeElement(): PickerField {
+// 		return this.templatedItemsView;
+// 	}
 
-	public get className(): string {
-		return this._className;
-	}
+// 	public get className(): string {
+// 		return this._className;
+// 	}
 
-	protected templatedItemsView: PickerField;
+// 	protected templatedItemsView: PickerField;
 
-	constructor(_elementRef: ElementRef, _iterableDiffers: IterableDiffers, _ngZone: NgZone) {
-		
-	}
+// 	constructor(_elementRef: ElementRef, _iterableDiffers: IterableDiffers, _ngZone: NgZone) {
+// 		_elementRef.nativeElement.on('loaded', (ev: EventData) => {
+// 			this.nativeElement.on('classNameChange', this.onClassNameChange.bind(this));
+// 		});
+// 	}
 
-	ngAfterContentInit() {
-		this.nativeElement.on('classNameChange', this.onClassNameChange.bind(this));
-	}
+// 	ngOnDestroy() {
+// 		if (this.nativeElement) {
+// 			this.nativeElement.off('classNameChange', this.onClassNameChange.bind(this));
+// 		}
+// 	}
 
-	ngOnDestroy() {
-		if (this.nativeElement) {
-			this.nativeElement.off('classNameChange', this.onClassNameChange.bind(this));
-		}
-	}
+// 	private onClassNameChange(args) {
+// 		this._className = (<View>args.object).className;
+// 	}
+// }
 
-	private onClassNameChange(args) {
-		this._className = (<View>args.object).className;
+
+
+
+import { AfterContentInit, ChangeDetectionStrategy, Component, ElementRef, forwardRef, IterableDiffers, NgZone } from '@angular/core';
+import { ListViewComponent, TEMPLATED_ITEMS_COMPONENT } from '@nativescript/angular';
+import { PickerValueAccessor } from './picker.accessors';
+
+@Component({
+  selector: 'PickerField',
+  template: `<DetachedContainer>
+    <ng-container #loader></ng-container>
+  </DetachedContainer>`,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [{ provide: TEMPLATED_ITEMS_COMPONENT, useExisting: forwardRef(() => PickerFieldComponent) }],
+})
+export class PickerFieldComponent extends ListViewComponent implements AfterContentInit {
+	constructor(_elementRef: ElementRef, _iterableDiffers: IterableDiffers, zone: NgZone) {
+		super(_elementRef, _iterableDiffers, zone);
 	}
 }
 
-export const DIRECTIVES = [PickerFieldComponent, PickerValueAccessor];
+export const DIRECTIVES = [PickerFieldComponent, PickerValueAccessor];
