CUSTOM_ELEMENTS_SCHEMA 添加到 NgModule.schemas 仍然显示错误 [英] CUSTOM_ELEMENTS_SCHEMA added to NgModule.schemas still showing Error
问题描述
我刚刚从 Angular 2 rc4 升级到 rc6,但遇到了麻烦.
I just upgraded from Angular 2 rc4 to rc6 and having troubles doing so.
我在控制台上看到以下错误:
I see the following error on my console:
Unhandled Promise rejection: Template parse errors:
'cl-header' is not a known element:
1. If 'cl-header' is an Angular component, then verify that it is part of this module.
2. If 'cl-header' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("<main>
[ERROR ->]<cl-header>Loading Header...</cl-header>
<div class="container-fluid">
<cl-feedbackcontai"): AppComponent@1:4
这是我的标题组件:
import { Component } from '@angular/core';
import { Router } from '@angular/router';
// own service
import { AuthenticationService } from '../../../services/authentication/authentication.service.ts';
import '../../../../../public/css/styles.css';
@Component({
selector: 'cl-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.css']
})
export class HeaderComponent { // more code here... }
这是我的头模块:
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { HeaderComponent } from './../../../components/util_components/header/header.component.ts';
@NgModule({
declarations: [ HeaderComponent ],
bootstrap: [ HeaderComponent ],
imports: [ RouterModule, CommonModule, FormsModule ],
schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class HeaderModule { }
我创建了一个名为 util 模块的包装模块,它导入了 HeaderModule:
I created a wrapper module called util module which imports the HeaderModule:
import { NgModule } from '@angular/core';
import {HeaderModule} from "./header/header.module";
// ...
@NgModule({
declarations: [ ],
bootstrap: [ ],
imports: [ HeaderModule]
})
export class UtilModule { }
最后由AppModule导入:
Which is finally imported by the AppModule:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import {UtilModule} from "./modules/util_modules/util.module";
import {RoutingModule} from "./modules/routing_modules/routing.module";
@NgModule({
bootstrap: [AppComponent],
declarations: [AppComponent],
imports: [BrowserModule, UtilModule, RoutingModule]
})
export class AppModule { }
据我所知,我正在按照错误消息的说明使用 SCHEMA 来抑制错误.但它似乎不起作用.我究竟做错了什么?(我希望这没什么明显的,我只是暂时看不到.过去 6 个小时一直在升级到这个版本......)
To my understanding I am following the instructions of the error message using the SCHEMA to surpress the error. But it seems not to work. What am I doing wrong? (I hope its nothing obvious I just don't see at the moment. Been spending the past 6 hours upgrading to this version...)
推荐答案
此问题已修复:
a) 将 schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
添加到每个组件或
a) adding schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
to every component or
b) 添加
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
和
schemas: [
CUSTOM_ELEMENTS_SCHEMA
],
到你的模块.
这篇关于CUSTOM_ELEMENTS_SCHEMA 添加到 NgModule.schemas 仍然显示错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!