我已经将不断增长的ng2应用程序升级到RC5,并将所有组件/管道放入一个胖主模块中。为了对抗膨胀,我试图将我的应用程序划分为单独的模块(也着眼于最终进行延迟加载)。
这是我创建的子模块,其中包含一些通用组件:
my-shared.module.ts
import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { FormsModule } from "@angular/forms";
import { provideForms, disableDeprecatedForms } from"@angular/forms";
import { TabBarWidgetComponent } from "./tabBarWidget/tabbar-widget.component";
import { MyDatepickerComponent } from "./mykDatePicker/my-datepicker.component";
import { CalendarSelectorComponent } from "./calendarSelector/calendar-selector.component";
import { AccordionTabComponent } from "./accordionTab/accordion-tab.component";
@NgModule({
imports: [
BrowserModule,
FormsModule
],
declarations: [
TabBarWidgetComponent,
MyDatepickerComponent,
CalendarSelectorComponent,
AccordionTabComponent
],
providers: [
provideForms(),
disableDeprecatedForms()
]
})
export class MySharedModule { }
到现在为止还挺好。现在,我想在主app.module.ts中引用此MySharedModule,并且正在执行以下操作:
import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { FormsModule } from "@angular/forms";
import { HttpModule } from "@angular/http";
import { MySharedModule } from "./shared/my-shared.module";
import { Some1Component } from "./folder/some1.component";
import { Some2Component } from "./folder/some2.component";
import { Some3Component } from "./folder/some3.component";
import { Some4Component } from "./folder/some4.component";
import { Some5Component } from "./folder/some5.component";
import "rxjs/add/operator/map";
import "rxjs/add/operator/toPromise";
@NgModule({
imports: [
BrowserModule,
FormsModule,
HttpModule,
MySharedModule
],
declarations: [
AppComponent,
Some1Component,
Some2Component,
Some3Component,
Some4Component,
Some5Component,
],
providers: [],
bootstrap: [AppComponent],
entryComponents: []
})
export class AppModule { }
问题是我收到以下错误(这表明该子模块组件未被app.module.ts中定义的应用识别):
无法绑定到“标签”,因为它不是“标签栏”的已知属性。1.如果“ tab-bar”是Angular组件,并且具有“ tabs”输入,则请确认它是该模块的一部分。2.如果“ tab-bar”是Web组件,则将“ CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“ @ NgModule.schema”以禁止显示此消息。
谁能看到我做错了吗?
尝试exports
在共享模块中添加部分。
import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { FormsModule } from "@angular/forms";
import { provideForms, disableDeprecatedForms } from"@angular/forms";
import { TabBarWidgetComponent } from "./tabBarWidget/tabbar-widget.component";
import { MyDatepickerComponent } from "./mykDatePicker/my-datepicker.component";
import { CalendarSelectorComponent } from "./calendarSelector/calendar-selector.component";
import { AccordionTabComponent } from "./accordionTab/accordion-tab.component";
@NgModule({
imports: [
BrowserModule,
FormsModule
],
exports: [
TabBarWidgetComponent,
MyDatepickerComponent,
CalendarSelectorComponent,
AccordionTabComponent
],
declarations: [
TabBarWidgetComponent,
MyDatepickerComponent,
CalendarSelectorComponent,
AccordionTabComponent
],
providers: [
provideForms(),
disableDeprecatedForms()
]
})
export class MySharedModule { }
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句