角度误差:当在子模块中声明时,’组件’X’不包含在模块中……
发布时间:2020-12-17 06:49:57 所属栏目:安全 来源:网络整理
导读:我正在尝试将我的对话框合并到一个Angular模块中,但是我在IDE中遇到了一个linting错误: Component ‘X’ is not included in a module and will not be available inside a template. Consider adding it to an NgModule declaration. 据我所知,您不必导出
我正在尝试将我的对话框合并到一个Angular模块中,但是我在IDE中遇到了一个linting错误:
据我所知,您不必导出组件(仅管道和指令)以在其他模块中使用它们. 尽管存在此错误,应用程序仍会加载并成功运行. 示例组件定义 import { Component,Inject,OnInit,ViewEncapsulation } from '@angular/core'; import { MAT_DIALOG_DATA,MatDialogRef } from '@angular/material'; export interface AlertDialogData { titleText: string; dismissalText: string; contentComponent: string; } @Component({ selector: 'app-alert-dialog',templateUrl: './alert-dialog.component.html',styleUrls: ['./alert-dialog.component.scss'],encapsulation: ViewEncapsulation.None }) export class AlertDialogComponent implements OnInit { constructor(private dialogRef: MatDialogRef<AlertDialogComponent>,@Inject(MAT_DIALOG_DATA) public data: any) { } ngOnInit() { } handleCloseClick(): void { this.dialogRef.close(); } } 子模块制作声明/导出 import { CUSTOM_ELEMENTS_SCHEMA,NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ZipLocatorDialogComponent } from './zip-locator-dialog/zip-locator-dialog.component'; import { AlertDialogComponent } from './alert-dialog/alert-dialog.component'; import { HelperDialogComponent } from './helper-dialog/helper-dialog.component'; import { MatAutocompleteModule,MatButtonModule,MatDialogModule,MatFormFieldModule,MatInputModule,MatSelectModule } from '@angular/material'; import { FlexLayoutModule } from '@angular/flex-layout'; import { FormsModule,ReactiveFormsModule } from '@angular/forms'; @NgModule({ imports: [ CommonModule,FlexLayoutModule,FormsModule,ReactiveFormsModule,MatSelectModule,MatAutocompleteModule,MatButtonModule ],exports: [ ZipLocatorDialogComponent,HelperDialogComponent,AlertDialogComponent ],declarations: [ ZipLocatorDialogComponent,entryComponents: [ ZipLocatorDialogComponent,schemas: [ CUSTOM_ELEMENTS_SCHEMA ] }) export class AppDialogsModule { } 应用模块 // <editor-fold desc="Global Application Imports"> import { BrowserModule } from '@angular/platform-browser'; import { NgModule,CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HTTP_INTERCEPTORS,HttpClientModule } from '@angular/common/http'; import { RouterModule } from '@angular/router'; import { RouteDefinitions } from './app.routes'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { FlexLayoutModule } from '@angular/flex-layout'; import { WebWrapperModule } from 'web-wrapper'; import { UiComponentsModule } from './ui-components.module'; import { AppComponent } from './app.component'; // OPERATORS import './rxjs-operators'; // SERVICES import { LoginManagerService } from './services/login-manager.service'; import { UtilsService } from './services/utils.service'; import { DataManagerService } from './services/data-manager.service'; import { ReferenceDataManagerService } from './services/reference-data-manager.service'; import { InfrastructureApiService } from './services/infrastructure-api.service'; // </editor-fold> @NgModule({ declarations: [ AppComponent ],imports: [ BrowserModule,BrowserAnimationsModule,HttpClientModule,WebWrapperModule,UiComponentsModule,AppDialogsModule,RouterModule.forRoot(RouteDefinitions) ],providers: [ UtilsService,LoginManagerService,DataManagerService,InfrastructureApiService,ReferenceDataManagerService ],schemas: [ CUSTOM_ELEMENTS_SCHEMA ],bootstrap: [AppComponent] }) export class AppModule { } 版本 Angular CLI: 1.5.0 Node: 7.2.1 OS: win32 x64 Angular: 4.4.6 ... animations,common,compiler,compiler-cli,core,forms ... http,language-service,platform-browser ... platform-browser-dynamic,router,tsc-wrapped @angular/cdk: 2.0.0-beta.12 @angular/cli: 1.5.0 @angular/flex-layout: 2.0.0-beta.11-b01c2d7 @angular/material: 2.0.0-beta.12 @angular-devkit/build-optimizer: 0.0.32 @angular-devkit/core: 0.0.20 @angular-devkit/schematics: 0.0.35 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.8.0 @schematics/angular: 0.1.2 typescript: 2.4.2 webpack: 3.8.1 解决方法
我有同样的问题,这是如何解决的:
1)转到Intellij / IDE设置并勾选(设置)对以下更改的重新编译: 2)转到tsconfig.json并将compileOnSave设置为true: 现在去除导致问题的@Component,并重新键入@Component. 这对我有用:)祝你好运. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
相关内容
- 在新shell中运行bash命令,并在此命令执行后保留在新shell中
- angular – 属性绑定与属性插值
- 什么新功能将添加到Scala 2.9?
- vsto – 如何让我的应用程序读取应用程序配置而不是machine
- Promise.catch()在AngularJS单元测试中没有捕获异常
- 接口程序:webservice发送报文二:
- 从vim中删除光标到括号(等)的末尾
- angularjs – 如何在不对控制器进行dom操作的情况下将一些角
- angularjs – 如何将角度材料datepicker的ng-model字符串格
- scala – 无法使用光滑的3.0.0-RC1找到TableQuery的方法结果