0

我仍在通过Angular2挖掘自己的方式。我尝试在线检查，但找不到任何表明可能的信息。

我的问题是——

我可以在一页上只有一个 ngModal，并且不仅提供不同的内容，而且提供不同的 HTML 格式。所以让我们假设我的页面上有两个按钮，当我点击一个时，下面是模态的外观 -

<ng-template #content let-c="close" let-d="dismiss">
  <div class="modal-header">
    <h4 class="modal-title">{{ModalTitle}}</h4>
    <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    <p>One fine body&hellip;</p>
  </div>
  <div class="modal-footer" *ngIf="footerEnabled">
    <button type="button" class="btn btn-secondary" (click)="c('Close click')">Close</button>
  </div>
</ng-template>

当我点击另一个时，

<ng-template #content let-c="close" let-d="dismiss">
  <div class="modal-header">
    <h4 class="modal-title">{{ModalTitle}}</h4>
    <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    <span>One fine body&hellip;</span>
  </div>
  <div class="modal-footer" *ngIf="footerEnabled">
    <button type="button" class="btn btn-secondary" (click)="c('Close click')">Close</button>
  </div>
</ng-template>

这可能吗？我的实际用例是在 Modal 中显示不同结构的表格。

任何帮助将不胜感激。

谢谢，普拉蒂克

4

1 回答 1

1

是的，这是可能的。只需通过内部 html 绑定指令添加它。

<ng-template #content let-c="close" let-d="dismiss">
  <div class="modal-header">
    <h4 class="modal-title">{{ModalTitle}}</h4>
    <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body" [innerHTML]="ModalContent">
  </div>
  <div class="modal-footer" *ngIf="footerEnabled">
    <button type="button" class="btn btn-secondary" (click)="c('Close click')">Close</button>
  </div>
</ng-template>

请参见Angular HTML 绑定

于 2017-05-31T13:06:48.050 回答