typescript 'modal' 不是已知元素：在 angular2 中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/40303003/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
'modal' is not a known element: in angular2
提问by MMR
I tried using model box in angular2,i know hoe to use it with systemConfig.js but now in my new project i have webpack.js and i am not sure how to use with it. my component,
我尝试在 angular2 中使用模型框，我知道可以将它与 systemConfig.js 一起使用，但现在在我的新项目中我有 webpack.js，但我不确定如何使用它。我的组件，
import {Component,OnInit} from "@angular/core";
import {ModalModule} from "ng2-modal";
import { Http, Headers } from '@angular/http';
@Component({
selector: '[tables-basic]',
template: `
<div class="row">
<button (click)="myModal.open()">open my modal</button>
<modal #myModal>
<modal-header>
<h1>Modal header</h1>
</modal-header>
<modal-content>
Hello Modal!
</modal-content>
<modal-footer>
<button class="btn btn-primary" (click)="myModal.close()">close</button>
</modal-footer>
</modal>
</div>
`
})
export class TablesBasic implements OnInit {
students:any;
constructor(public http: Http) {
}
ngOnInit() {
this.getstudents();
}
getstudents() {
var headers = new Headers();
headers.append('Content-Type', 'application/json')
this.http.get('http://localhost:3009/api/auth/getstudents', { headers: headers })
.subscribe(
result => {
if (result.json().error_code == 0) {
this.students = result.json().result;
}
else {
this.students = result.json().result;
}
})
}
}
my error, Error: Template parse errors: 'modal' is not a known element: 1. If 'modal' is an Angular component, then verify that it is part of this module. 2. If 'modal' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. (" open my modal [ERROR ->]
我的错误，错误：模板解析错误：'modal' 不是已知元素： 1. 如果 'modal' 是一个 Angular 组件，则验证它是否是该模块的一部分。2. 如果'modal' 是一个Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的'@NgModule.schema' 以抑制此消息。(" 打开我的模态 [错误 ->]
Modal header
模态标题
任何人都可以请建议我帮忙。回答by ranakrunal9
You need to import ModalModulein your AppModulefile and need to add ModalModuleinside @NgModule.importsas below :
您需要导入ModalModule您的AppModule文件，并需要在ModalModule里面添加@NgModule.imports如下：
import {ModalModule} from "ng2-modal";
@NgModule({
imports: [
// ...
ModalModule
],
declarations: [
App,
TablesBasic
],
bootstrap: [
App
]
})
export class AppModule {
}
回答by Kartik Rajendran
I had similar error while using third party component "ng2-bs3-modal"
There was no build error but while loading the page, it didn't load it and showed
"Loading…"
message only.
我在使用第三方组件“ng2-bs3-modal”时遇到了类似的错误没有构建错误，但是在加载页面时，它没有加载它并且只显示
“正在加载...”消息。
The solution is 1. Add "import { Ng2Bs3ModalModule } from 'ng2-bs3-modal/ng2-bs3-modal';" in app.module.ts 2. Add "Ng2Bs3ModalModule" in the imports section under @NgModule portion
解决方法是1.添加“import { Ng2Bs3ModalModule } from 'ng2-bs3-modal/ng2-bs3-modal';” 在 app.module.ts 中 2. 在 @NgModule 部分下的导入部分添加“Ng2Bs3ModalModule”
This changes solved the problem.
这个改动解决了这个问题。
You also may refer https://github.com/dougludlow/ng2-bs3-modal/issues/124
您也可以参考 https://github.com/dougludlow/ng2-bs3-modal/issues/124
回答by Sarad Vishwakama
I also faced the same problem. followed below mention step to solve problem.
我也面临同样的问题。按照下面提到的步骤来解决问题。
.npm install ng2-modal
.npm 安装 ng2-modal
then Import ModalModuleinto imports: section of @ngModule
然后将ModalModule导入到导入中：@ngModule 的部分
