我试图使用的模式NG2自举。因此,我将所有内容配置为与以下示例相同:
import { ModalModule } from 'ng2-bootstrap/ng2-bootstrap';
@NgModule({
bootstrap: [ AppComponent ],
declarations: [
AppComponent,
...
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
RouterModule.forRoot(ROUTES),
ModalModule
],
providers: [ ]
})
但是我仍然收到以下错误:
无法读取未定义的属性“ show”
零件:
import { ViewContainerRef } from '@angular/core';
@Component({
selector: 'any-comp',
encapsulation: ViewEncapsulation.None,
templateUrl: './any-comp.component.html'
})
export class AnyCompComponent implements OnInit {
private viewContainerRef: ViewContainerRef;
constructor(
private pageContentService: PageContentService,
viewContainerRef: ViewContainerRef) {
this.viewContainerRef = viewContainerRef;
}
模板:
<button class="btn btn-primary" (click)="lgModal.show()">Large modal</button>
<div bsModal="bsmodal" #lgmodal="bs-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" class="modal fade">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" (click)="lgModal.hide()" aria-label="Close" class="close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Large modal</h4>
</div>
<div class="modal-body">...</div>
</div>
</div>
</div>
我怎样才能解决这个问题?
模板变量是大小写敏感的,在你的情况下,#lgmodal
(小写字母“M”)和你想显示lgModal
的点击(大写“M”) (click)="lgModal.show()"
。因此,只需更改模板变量,使其与from(click)
事件中的变量匹配即可#lgModal
。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句