Valuing @Input() properties of scene component

[cmalosse]

Probably a noob question there.
I'm migrating from @angular/three to the angular-threejs renderer.
Since we provide a scene component class to the ngt-canvas, how is it possible to interact with the instance of the scene?
If I put that in another way:
My host component template has <ngt-canvas [sceneGraph]="PreviewScene" />
And my PreviewScene has @Input() selectedId :number;.
How do I set a value to previewScene.selectedId from host component ?
A solution to pass parameters to PreviewScene constructor would also do the trick for me.

Thanks

[nartc]

@cmalosse You'd need to use an InjectionToken or a Service

1. If the selectId is set once, use regular number
2. If the selectId can change, use Observable<number>

export const SELECTED_ID = new InjectionToken<number>('selectedId');
// can also be an Observable: export const SELECTED_ID = new InjectionToken<Observable<number>>('selectedId$');

@Component({/* */)
export class PreviewScene {
    readonly selectedId = inject(SELECTED_ID);
    // or use constructor(@Inject(SELECTED_ID) private readonly selectedId: number) {}
}

// provide the token with: {provide: SELECTED_ID, useValue/useFactory etc...}

[nartc]

Here's an example (used in angular-three-soba's Storybook: https://github.com/angular-threejs/soba/blob/main/libs/angular-three-soba/src/setup-canvas.ts). Please do not hesitate to ask clarification questions if you have any

[cmalosse]

I've read the very same example.
I was hoping there'd be a simpler way.
Thanks 👍

[nartc]

As soon as Angular supports passing EnvironmentInjector to TemplateRef, then it would be much simpler. Sorry for the inconvenience

[cmalosse]

I was suspecting a limitation of Angular, but I'm to much a rooky on the subject to be sure.
Thanks for the clarification and your good job.