angular2中的未知HTML标签模式答案

【问题标题】：Unknown HTML tag modal in angular2angular2中的未知HTML标签模式
【发布时间】：2017-09-09 13:24:30
【问题描述】：

我想创建引用此链接的自定义模式窗口：- http://jasonwatmore.com/post/2017/01/24/angular-2-custom-modal-window-dialog-box

当我使用它时，它显示未知的 HTML 标记，并且在控制台上显示错误，即

未处理的 Promise 拒绝：模板解析错误： 'modal' 不是已知元素： 1. 如果 'modal' 是一个 Angular 组件，那么验证它是这个模块的一部分。 2. 如果 'modal' 是一个 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。 (" 打开模态1

[ERROR ->]<modal id="custom-modal-1">
  <div class="modal">
    <div class="modal-body">

")：HeapMemoryGraphComponent@6:4；区域：；任务：Promise.then；值：错误：模板解析错误： 'modal' 不是已知元素：

请指导，谢谢。

【问题讨论】：

您的模态代码，即带有选择器的 ts 文件：'modal'，是否已在您的 app.module.ts 文件中注册？在您的@NgModule 声明中，导入文件后？
参考这个answer

标签： angular modal-window

【解决方案1】：

将此组件放入app.module的声明中

@NgModule({
imports: [
    BrowserModule,
    FormsModule
],
declarations: [
    AppComponent,
    ModalComponent <----
],
providers: [
    ModalService
],
bootstrap: [AppComponent]
})

【讨论】：

嘿 Dmitrij，ModalComponent 在声明中显示错误（找不到名称 ModalComponent）。
从'@angular/core'导入{组件，ElementRef，输入，OnInit，OnDestroy}；从“./modal.service”导入{ModalService}； @Component({ moduleId: module.id.toString(), selector: 'modal', template: '' }) 导出类 ModalComponent 实现 OnInit, OnDestroy { @Input() id ：细绳;私有元素：jQuery；构造函数（私有 modalService：ModalService，私有 el：ElementRef）{ this.element = $(el.nativeElement); } ngOnInit(): void { 让 modal = this;