与将组件添加到Angular6中的另一个组件有关的问题

Question

我有Angular 6 Web应用程序。

我有以下结构：

src
 -app
   -auth  - folder
       -auth.component.html               
       -auth.component.scss
       -auth.component.ts 
       -auth.module.ts 
   -car-details  - folder
       -binning-table  - folder
             -binning-table.component.html
             -binning-table.component.ts
             -binning-table.component.scss
       -car-detail.component.html
       -car-detail.component.ts
       -car-detail.component.scss
       -car-detail.module.ts
    -import-binning   - folder
        -import-binning.component.html
        -import-binning.component.scss
        -import-binning.component.ts
   -app.component.html
   -app.component.scss
   -app.component.ts
   -app.module.ts

现在，将car-detail module注册到auth.module.ts并将authModule注册到app.module 。

我想将binning-table component加载到import-binning.html

为了将一个组件加载到另一个组件应该进行哪些更改。

我需要在哪个模块中注册哪种连接

谢谢

Answer 1

我们不需要注册模块，而是在需要时导入它，一个模块可以导入到多个模块（例如共享模块）中。

但是我们只能在一个模块中声明一个组件，如果我们需要在另一个模块中使用相同的组件，则可以从同一模块中导出该组件，然后将该模块导入到需要的模块中

例如，如果我们有一个在模块名称module1中声明的名称为A的组件，并且如果我们需要在其他模块（即模块2）中使用相同的组件，则执行类似的操作。

@NgModule({
declarations: [
 Acomponent
],
exports: [
 Acomponent
 ]
})
export class Module1 {}

@NgModule({
 imports: [Module1]
})
export class Module2

通过使用以上语法，我们可以在module1和module2中使用AComponent，通常，在整个应用程序中共享的组件通常都将它们放在共享模块中。

Answer 2

您无需在“ app.module.ts”中声明“ BinningTableComponent”，而需要在“ car-details.module.ts”中声明。 您需要在导出数组中包含相同的组件“ BinningTableComponent”。

所以car-details.module => auth.module => app.module。 您可以在app.component.ts中访问“ BinningTableComponent”。

请参阅stackblitz代码https://stackblitz.com/edit/angular-ivnodq