Angular-使用另一个模块中的组件

时间:2019-01-10 14:19:37

标签: angular

我在合同模块中有一个组件contractDetails,我想在另一个模块中使用此组件

我尝试导出contractDetails组件,但出现此错误

  

如果'contract-details'是Angular组件,则确认它是   该模块的一部分。

contract.module.ts

 @NgModule({
        imports: [
            CommonModule,
            ContractRoutingModule
        ],
        exports: [
            ContractDetailsComponent
        ],
        declarations: [
            ContractDetailsComponent
        ]
    })
    export class ContractModule { }

contract-details.component.ts

@Component({
        selector: 'contract-details',
        templateUrl: './contract-details.component.html'
    })
    export class ContractDetailsComponent {

    }

organization.module.ts

@NgModule({
    imports: [
        CommonModule,
        OrganizationRoutingModule
    ],
    declarations: [
        OrganizationDetailsComponent
    ]
})
export class OrganizationModule { }

organization-details.component.ts

@Component({
    templateUrl: './organization-details.component.html',
    styleUrls: ['./organization-details.component.scss']
})
export class OrganizationDetailsComponent {
}

organization-details.component.html

<contract-details></contract-details>

1 个答案:

答案 0 :(得分:1)

OrganizationModule需要导入ContractModule才能使用ContractDetailsComponentOrganizationModule的定义应为:

@NgModule({
  imports: [
    CommonModule,
    OrganizationRoutingModule,
    ContractModule,
  ],
  declarations: [
    OrganizationDetailsComponent
  ]
})
export class OrganizationModule { }