Search code examples
angularnestedcomponentsangular17

how to use nested components in angular 17 with standalone components?


Since angular now has stanalone components, how do we show one comonent inside another like we used to. e.g inside app body

I dont have any idea about how standalone components work and i'm a fresher in angular just migrated from angular 12 to angular 17.


Solution

  • I might have misunderstood, but nothing has really changed in respect of child components. The only difference is the parent component will need to import the child component reference in the imports array:

    @Component({
      standalone: true,
      selector: 'parent',
      imports: [ChildComponent],
      template: `
        ... <child></child>
      `,
    })
    

    I found this guide to the standalone API very useful: Getting started with standalone components.