In my application, I am using a list view where clicking on a list item triggers the injection of a new component below it to create a view/edit window. The method I use for dynamic component creation is as follows:
private alertViewEditFactory(cRef: ViewContainerRef, alert: Alert, mode: number): ComponentRef<AlertViewEditComponent> {
const ref = cRef.createComponent(this.factory);
// Is there a risk of the component rendering before input arguments are set?
ref.instance.mode = mode;
ref.instance.alert = alert;
ref.instance.service = this.userService;
return ref;
}
Here, mode
, alert
, and service
are all declared as @Input()
.
Query: Could there be a scenario where setting input arguments after component creation leads to the view rendering before the arguments are applied? While this hasn't occurred in my experience so far, I'm curious if there might be a more secure approach for creating the component and simultaneously setting input arguments.