我正在尝试使用@ ng-bootstrap / ng-bootstrap打开Ngb模式。
但是每当我尝试打开Ngb Modal时,它在屏幕上都不可见。
我还试图在函数内部调用警报。警报功能被调用,但是模式弹出窗口在我的屏幕上不可见。
当我单击检查元素时,代码和所有信息都可用。
这是我的代码。
component.html文件
<ng-template #content1 let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">Add New Topic</h4>
<button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-style-5">
<form>
<div class="form-group">
<input type="text" required style="color=#000000
" #tname name="field1" placeholder="Enter Name...">
<BR>
<input type="text" style="color=#000000
" #sname name="field2" placeholder="Enter Subject...">
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-dark" (click)="adddiscussions(tname.value,sname.value);modal.close('Save click')">Save</button>
</div>
</ng-template>
component.ts文件
openBackDropCustomClass(content, tp) {
this.modalService.open(content, {
backdropClass: 'light-blue-backdrop'
});
}
open(content) {
alert("jayu"); // here I am making alert and it is coming on screen
this.modalService.open(content, {
ariaLabelledBy: 'modal-basic-title'
}).result.then((result) => {
this.closeResult = `Closed with: ${result}`;
}, (reason) => {
this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
});
}
private getDismissReason(reason: any): string {
if (reason === ModalDismissReasons.ESC) {
return 'by pressing ESC';
} else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
return 'by clicking on a backdrop';
} else {
return `with: ${reason}`;
}
}
我重新安装了节点模块。我重新安装了引导程序,但所有程序都无法正常工作。
在尝试所有已知方法时,有人可以帮助我吗?
提前谢谢!