【问题标题】:Popup close button is not working in angular6?弹出关闭按钮在 angular6 中不起作用?
【发布时间】:2019-12-23 14:10:04
【问题描述】:

我在这里附上了我的弹出框代码。这里的关闭按钮不起作用。我对 Angular 6 完全陌生。有人可以帮我吗?

<!-- Modal Header -->
<div class="modal-header">
  <h4 class="modal-title">selection</h4>
</div>
<form>
<!-- Modal body -->
<div class="modal-body">
    <h5>Enter value:</h5>
    <div class="form-group">
        <input name="Id" type="text" class="form-control shadow-sm" placeholder="Enter value">
    </div>
    <div class="form-group">
        <input name="name" type="text" class="form-control shadow-sm" placeholder="Enter name">
    </div>
</div>
<!-- Modal footer -->
<div class="modal-footer">
    <button type="button" class="btn btn-cancel shadow-sm" data-dismiss="modal">CLOSE</button>
    <button type="submit" class="btn btn-submit shadow-sm">SUBMIT</button>
</div>

【问题讨论】:

  • 你用的是ngbootstrap还是material design?
  • ngbootstrap 是 Angular 的引导模块吗? @sureshkumarariya
  • 它的 UI 框架使用 Bootstrap4 类构建。 ng-bootstrap.github.io/#/home
  • 是的,我们只使用引导类 @aureshkumarariya
  • 您需要使用 ngBootstrap,它是为 Angular 2+ 构建的 Bootstrap 4 组件。他们有模型的例子。这是网址ng-bootstrap.github.io/#/components/modal/examples

标签: html angular typescript popup angular6


【解决方案1】:

试试这个:

 import { DataModalComponent } from './patient-modal/patient-modal.component';
    import { NgbModal, NgbModalOptions } from '@ng-bootstrap/ng-bootstrap';


     let ngbModalOptions: NgbModalOptions = {
          backdrop : 'static',
          keyboard : false,
          size: "lg"
        }; 
        const modalRef = this.modalService.open(DataModalComponent ,ngbModalOptions);

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-02-01
    • 2012-01-25
    • 2013-11-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多