Question

我正在使用引导程序mdb中的模式作为角度删除对话框的对话框。您能告诉我如何将数据传递给模态吗？我从“ https://mdbootstrap.com/docs/angular/modals/basic/”中获取了模式代码。这是用于angular的MDB引导程序。

这是通过确认删除我的代码的方式：

<div
  mdbModal
  #basicModal="mdbModal"
  class="modal fade"
  tabindex="-1"
  role="dialog"
  aria-labelledby="myBasicModalLabel"
  aria-hidden="true"
>
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title w-100" id="myModalLabel">
          Are you sure you want to delete this record?
        </h4>
      </div>
      <div class="modal-footer">
        <button
          type="button"
          mdbBtn
          color="secondary"
          class="waves-light"
          aria-label="Close"
          (click)="basicModal.hide()"
          mdbWavesEffect
        >
          No
        </button>
        <button
          type="button"
          mdbBtn
          color="danger"
          class="relative waves-light"
          mdbWavesEffect
          (click)="onRemove(log)"
        >
          Yes, remove
        </button>
      </div>
    </div>
  </div>
</div>

<mdb-card>
    <mdb-card-body>
      <table class="table table-striped table-responsive-md btn-table">
        <thead>
          <tr>
            <th>Remove</th>
          </tr>
        </thead>
        <tbody>
          <tr
            *ngFor="let log of logs; let i = index"
            [class]="i % 2 == 0 ? 'table-info' : ''"
          >
            <td>
              <span class="table-remove">
                <button
                  type="button"
                  mdbBtn
                  color="danger"
                  rounded="true"
                  size="sm"
                  class="my-0"
                  (click)="basicModal.show()"
                >
                  Remove
                </button>
              </span>
            </td>
          </tr>
        </tbody>
      </table>
    </mdb-card-body>
</mdb-card>

谢谢。

Answer 1

您可以在ts文件组件中打开模型：

将您的html更改为：

          (click)="openModal()"

在您的组件中添加以下内容：

  openModal() {
    this.modalRef = this.modalService.show(ModalComponent, { this.modalOptions });
  }

this.modalOptions是您的数据

如何将值传递给角度模态

1 个答案: