为什么使用router-outlet访问其他模块的组件不需要add to export [英] Why use router-outlet to access component of other module doesn't need add to export
问题描述
我不明白router-outlet
和module 的exports array
编译策略的区别.
router-outlet
将通过为什么我们需要将它添加到exports数组中,Angular不能像
<小时>router-outlet
那样自动生成模块中定义的组件.我知道如果我想使用其他模块的组件,需要添加到导出中.
通过路由器加载组件
解决方案<块引用>我应该导出什么?
导出组件中的可声明类其他 NgModules 能够在它们的模板中引用.这些是你的公开课.如果您不导出可声明的类,它将保持不变私有,仅对在此 NgModule 中声明的其他组件可见.
...
<块引用>
我不应该导出什么?
不要导出以下内容:
仅由路由器或引导程序动态加载的组件.这样的入口组件永远不能在另一个组件的模板.虽然出口它们没有坏处,但也没有受益.
...
另请注意,路由器组件是自动添加到
entryComponents
列表.I don't understand the difference between
router-outlet
andmodule's exports array
compilation strategies.router-outlet
will auto generate component by ComponentFactoryResolver- if you are not use
router-outlet
to access component of other module, it will throw error from template parser
Why do we need to added it to exports array, Angular can't auto generate the component that defined in the module like
router-outlet
.
I know if I want to use component of other modules, it's needed add to exports.
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { FormsModule } from '@angular/forms'; import { AppComponent } from './app.component'; import { HelloComponent } from './hello.component'; import { M1Module } from './m1/m1.module'; // import { AppRoutingModule } from './app-routing.module'; @NgModule({ imports: [ BrowserModule, // AppRoutingModule, M1Module ], declarations: [AppComponent, HelloComponent], bootstrap: [AppComponent] }) export class AppModule { } ---------------------- @NgModule({ imports: [ CommonModule ], declarations: [ Comp1Component, Comp2Component ], exports: [ Comp1Component ] }) export class M1Module {}
<hello name="{{ name }}"></hello> <p> Start editing to see some magic happen :) </p> <app-comp1></app-comp1>
if I access the component through routing
(http://example.domain.com/comp1)
, it doesn't need to exports, it's can work.import { AppComponent } from './app.component'; import { HelloComponent } from './hello.component'; import { M1Module } from './m1/m1.module'; import { AppRoutingModule } from './app-routing.module'; @NgModule({ imports: [ BrowserModule, AppRoutingModule, M1Module ], declarations: [AppComponent, HelloComponent], bootstrap: [AppComponent] }) export class AppModule { } /*****************************************************/ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { Comp1Component } from './m1/comp1/comp1.component'; import { Comp2Component } from './m1/comp2/comp2.component'; const routes: Routes = [ { path: 'comp1', component: Comp1Component }, { path: 'comp2', component: Comp2Component } ]; @NgModule({ imports: [ RouterModule.forRoot(routes) ], exports: [ RouterModule ] }) export class AppRoutingModule {} /*****************************************************/ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Comp1Component } from './comp1/comp1.component'; import { Comp2Component } from './comp2/comp2.component'; @NgModule({ imports: [ CommonModule ], declarations: [Comp1Component, Comp2Component], }) export class M1Module { }
<hello name="{{ name }}"></hello> <p> Start editing to see some magic happen :) </p> <!-- it's need to use export --> <!-- <app-comp1></app-comp1> --> <!-- it doesn't need to use export --> <router-outlet></router-outlet>
thanks, everyone's answer, it's summary that I understand :
load component by module's exports array
load component by router
解决方案As explained in Angular NgModule FAQs:
What should I export?
Export declarable classes that components in other NgModules are able to reference in their templates. These are your public classes. If you don't export a declarable class, it stays private, visible only to other components declared in this NgModule.
...
What should I not export?
Don't export the following:
Components that are only loaded dynamically by the router or by bootstrapping. Such entry components can never be selected in another component's template. While there's no harm in exporting them, there's also no benefit.
...
Also note that router components are automatically added to the
entryComponents
list.这篇关于为什么使用router-outlet访问其他模块的组件不需要add to export的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!