我可以動態呈現NgModal的HTML

Question

我仍然在通過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中顯示不同結構的表格。

任何幫助將不勝感激。

感謝， PRATIK

Answer 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 2 html binding