07. Deep Component Injection

The Problem

A wizard or tab can contain another screen, which can itself contain another screen. The parent should not need to know every DOM detail of every descendant.

The Angular Difficulty

Angular can dynamically create nested components, but each dynamic level requires Angular view-container management and explicit component references.

Angular Approach

@ViewChild("stepHost", { read: ViewContainerRef })
stepHost!: ViewContainerRef;

openStep() {
    const ref = this.stepHost.createComponent(CustomerStepComponent);
    // The child component can itself own another ViewContainerRef.
}

MS Approach

ManySet provides a direct runtime-oriented approach for this recurring business-application task.

const a = await ms.inject("A", ms.id("DivA"));
const b = await ms.inject("B", a.divB);
const c = await ms.inject("C", b.divC);

Why this way is useful in business applications :

The comparison is intended to show where ManySet supplies a business-application abstraction around a recurring task, while keeping HTML and JavaScript visible and directly usable.

Key Point :

ManySet reduces the amount of framework-specific composition required for this particular task, without requiring the React/Angular mechanism to be represented as inherently wrong or incapable.