Modals - Angular4

Question

Ich bin auf der Suche nach dem besten Ansatz zur Implementierung von Modal in Angular 4 nach der Komponentenarchitektur.

Ich habe viele Tutorials, externe Bibliotheken, usw. gesehen, und die Verwendung ist ziemlich begrenzt. Im Grunde verfolgen alle von ihnen den Ansatz, einen modalen Dienst zu erstellen, um die Modale zu verwalten, und eine modale Komponente mit transclude, um die Vorlage abhängig vom Inhalt zu ändern. Dies erfordert, dass wir das Modal in die Vorlage der aktuellen Komponente einfügen müssen. Etwas wie folgt aus:

@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> 

Und dann die Nutzung wie folgt aus:

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

Dies ist eine feine Ansatz für kleine Anwendungen. Für große Anwendungen ist das keine gute Lösung. Die Idee wäre, einen Dienst zu haben, der Komponenten dynamisch öffnet, ohne sie zu definieren. So etwas in der Komponente: this.openModal(CustomModal)

Das ng-bootstrap tut etwas sehr ähnliches, aber es verwendet Bootstrap 4 und es ist immer noch in Alpha, so dass wir derzeit nicht sicher sind, ob es eine gültige Option ist. Jede Bibliothek, die auf diese Art und Weise funktioniert?

Answer 1

Ich empfehle sehr, ngx-bootstrap nicht zu verwenden und @ng-bootstrap zu verwenden. ngx-bootstrap's Mangel an Funktionen, hat @ ng-Bootstrap mehr Funktionen und Stabilität.

Ich begann mit ngx-bootstrap und änderte es schließlich. Ich sah auch Angular Team empfiehlt @ ng-Bootstrap-Paket in der ng-Conf.

Eigentlich habe ich mit einigen Komponenten von ngx-Bootstrap beigetragen, weil sie unvollständig sind.