[英]In Angular 8, how do I pass a component into another component's input and then use it imperatively in a router module
[英]How to use component in a in another module/router
我正在尝试使用另一个模块中的另一个组件,但它在我的路由器插座中不起作用。
应用模块
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { MainModule } from './main/main.module';
import { AppComponent } from './app/app.component';
import { KeypadComponent } from './keypad/keypad.component;
import { routing } from './app.routing';
@NgModule({
declarations: [
AppComponent,
MainComponent,
KeypadComponent
],
imports: [
BrowserModule,
CommonModule,
MainModule,
routing
],
bootstrap: [AppComponent]
})
export class AppModule { }
主模块
import { NgModule } from '@angular/core';
import { routing } from '../app.routing';
import { ProductComponent } from './product/product.component';
@NgModule({
imports: [
routing
],
declarations: [ProductComponent]
})
export class MainModule { }
我的问题是,当我尝试在product.component.html
调用键盘组件时,它会给我一个错误,说它不存在。 但是,当我在main.component.html
调用它时,它工作正常。
如果你的组件应该被 app 模块和主模块使用,它应该放在主模块或另一个共享模块中。 以下示例显示了如何使用共享模块。
应用模块声明
@NgModule({
declarations: [
AppComponent,
MainComponent,
],
imports: [
CommonModule,
MainModule,
SharedModule,
routing
],
bootstrap: [AppComponent]
})
export class AppModule { }
主模块声明
@NgModule({
imports: [
CommonModule,
routing,
SharedModule
],
declarations: [ProductComponent]
})
export class MainModule { }
共享模块声明
@NgModule({
imports: [ CommonModule ],
declarations: [ KeypadComponent ],
exports: [ KeypadComponent ]
})
export class SharedModule { }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.