保持未捕获(承诺):错误:模板解析错误:“组件"不是已知元素:
[英] Keep getting Uncaught (in promise): Error: Template parse errors: 'component' is not a known element:
本文介绍了保持未捕获(承诺):错误:模板解析错误:“组件"不是已知元素:的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
这是一些代码片段.
组件:
import { Component } from '@angular/core';@成分({选择器:'app-generalstatistics',templateUrl: './generalstatistics.component.html',styleUrls: ['./generalstatistics.component.css']})导出类一般统计{公共数据:数组<对象>;构造函数(){}}
app.module.ts:
import { Generalstatistics } from './views/generalstatistics/generalstatistics.component';声明: [....一般统计],
在 DashboardModule/DashboardComponent.html 中实现:
<div class="chart-wrapper mt-3 mx-3" style="height:70px;"><app-generalstatistics></app-generalstatistics>
错误:
core.js:4002 错误错误:未捕获(承诺):错误:模板解析错误:'app-generalstatistics' 不是已知元素:1. 如果'app-generalstatistics' 是一个Angular 组件,那么验证它是否是这个模块的一部分.2. 如果 'app-generalstatistics' 是一个 Web 组件,则将 'CUSTOM_ELEMENTS_SCHEMA' 添加到此组件的@NgModule.schemas"以抑制此消息.("
<div class="chart-wrapper mt-3 mx-3" style="height:70px;">[错误 ->]
"): ng:///DashboardModule/DashboardComponent.html
我到底做错了什么?
感谢您的帮助.
解决方案
我假设您应该将 app-generalstatistics
组件添加到 declarations: []
的 code>DashboardModule
以及(实际上就是你使用它的地方)
Afaik NgModule 是模板的编译上下文.所以我们必须在每个使用它的模块中声明一个组件.
为什么?在我的想法中:否则编译可能需要一段时间,因为在这种情况下,Angular 将不得不搜索组件定义,而这可能存在于任何依赖项中,包括 3rd 方.
Here are some code fragments.
Component:
import { Component } from '@angular/core';
@Component({
selector: 'app-generalstatistics',
templateUrl: './generalstatistics.component.html',
styleUrls: ['./generalstatistics.component.css']
})
export class Generalstatistics {
public data: Array<Object>;
constructor() { }
}
app.module.ts:
import { Generalstatistics } from './views/generalstatistics/generalstatistics.component';
declarations: [
....
Generalstatistics
],
Implementation in DashboardModule/DashboardComponent.html:
<div class="chart-wrapper mt-3 mx-3" style="height:70px;">
<app-generalstatistics></app-generalstatistics>
</div>
Error:
core.js:4002 ERROR Error: Uncaught (in promise): Error: Template parse errors:
'app-generalstatistics' is not a known element:
1. If 'app-generalstatistics' is an Angular component, then verify that it is part of this module.
2. If 'app-generalstatistics' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the
'@NgModule.schemas' of this component to suppress this message. ("
</div>
<div class="chart-wrapper mt-3 mx-3" style="height:70px;">
[ERROR ->]<app-generalstatistics></app-generalstatistics>
</div>
</div>
"): ng:///DashboardModule/DashboardComponent.html
What exactly am I doing wrong?
Thanks for help.
解决方案
I assume you should add the app-generalstatistics
component to the declarations: []
of your DashboardModule
as well (Actually just where you use it)
Afaik the NgModule is the compilation context for the templates.
So we have to declare a component in every module in which it is used.
Why? In my thinking: Otherwise the compilation would probably take a while because in that case Angular would have to go searching for the components definition and that could possibly be in any dependency including 3rd parties.
这篇关于保持未捕获(承诺):错误:模板解析错误:“组件"不是已知元素:的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!