Modals - Angular4

Question

我正在尋找最佳的方法來實現模塊在Angular 4中遵循組件架構。

我見過很多教程，外部庫等，它的使用非常有限。基本上所有這些都遵循創建模態服務的方法，管理模式和模式組件，並通過transclude來根據內容更改模板。這要求我們需要將模態放入當前組件的模板中。事情是這樣的：

@Component({ 
selector: 'modal', 
template: ` 
    <div [ngClass]="{'closed': !isOpen}"> 
     <div class="modal-overlay" (click)="close(true)"></div> 

     <div class="modal"> 
      <div class="title" *ngIf="modalTitle"> 
       <span class="title-text">{{ modalTitle }}</span> 
       <span class="right-align" (click)="close(true)"><i class="material-icons md-24">clear</i></span> 
      </div> 

      <div class="body"> 
       <ng-content></ng-content> 
      </div> 
     </div> 
    </div> 

再使用這樣的：

<modal title='My title'> 
    <div> 
    My Modal 
    </div> 
</modal>` 

這對於小型應用罰款的做法。對於大型應用來說，這不是一個好的解決方案這個想法將是一個服務，打開組件動態而不定義它們。在這個組件中是這樣的：this.openModal(CustomModal)

ng-bootstrap做了一些與此類似的事情，但它使用的是Bootstrap 4，它仍然在alpha中，所以目前我們不確定它是否是一個有效的選項。任何以這種方式工作的圖書館或如何完成的任何方向？

Answer 1

我強烈建議不要使用ngx-bootstrap，並使用@ng-bootstrap。 ngx-bootstrap缺乏功能，@ ng-bootstrap具有更多功能和穩定性。

我從ngx-bootstrap開始，最後改變它。我還看到Angular團隊在ng-conf中推薦了@ ng-bootstrap軟件包。

實際上，我用ngx-bootstrap的某個組件貢獻未完成。