[英]Angular2 access submodule component
I have an Angular2 application with submodules: 我有一个带子模块的Angular2应用程序:
├───app (module)
│ ├───authentication (module)
│ │ ├───components
│ │ │ ├───login
│ │ │ ├───sign-in
│ │ │ ├───sign-up
│ │ │ ├───socials-callback
│ │ │ └───socials-sign-in
│ │ ├───models
│ │ └───services
│ ├───components
│ │ └───nav-bar
│ ├───home (module)
│ ├───shared (module)
│ │ ├───components
│ │ │ └───search-dropdown
│ │ └───services
│ └───user (module)
│ ├───models
│ └───services
Each components are declared in the module_name.module.ts
file (of their module). 每个组件都在
module_name.module.ts
文件(其模块)中声明。 Each modules files are imported in the app.module.ts
file. 每个模块文件都导入
app.module.ts
文件中。
Here is my app.module.ts
file: 这是我的
app.module.ts
文件:
import { BrowserModule } from '@angular/platform-browser';
import ...
import { SharedModule } from './shared/shared.module';
@NgModule({
imports: [
AppRoutingModule,
...
SharedModule
],
declarations: [
AppComponent
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
My shared.module.ts
file: 我的
shared.module.ts
文件:
import { NgModule } from '@angular/core';
import ...
import { SearchDropdownComponent } from './components/search-dropdown/search-dropdown.component';
@NgModule({
imports: [
CommonModule
],
declarations: [
SearchDropdownComponent
]
})
export class SharedModule { }
When I try to access to SearchDropdownComponent from a template of my app module, I have an error telling my that there is no component corresponding to it. 当我尝试从我的app模块的模板访问SearchDropdownComponent时,我有一个错误告诉我没有与之对应的组件。
But when I add the SearchDropdownComponent import directly on my app.module.ts file, it works. 但是当我直接在我的app.module.ts文件中添加SearchDropdownComponent导入时,它可以工作。
Isn't it possible to access to a component of a sub module? 是否可以访问子模块的组件? I am doing something wrong?
我做错了什么?
To make a component available outside the module, add it the module's exports
declaration. 要使模块在模块外部可用,请将模块的
exports
声明添加到模块中。
import { NgModule } from '@angular/core';
import ...
import { SearchDropdownComponent } from './components/search-dropdown/search-dropdown.component';
@NgModule({
imports: [
CommonModule
],
declarations: [
SearchDropdownComponent
],
exports: [
SearchDropdownComponent
]
})
export class SharedModule { }
API Reference: NgModule.exports API参考: NgModule.exports
Also note that a component can belong to only one module. 另请注意,组件只能属于一个模块。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.