Angular2: mit md-progress-circle

Question

Ich versuche md-progress-circle auf meiner Angular2 App zu verwenden. Ich habe eine Login-Formular-Komponente, und wenn Benutzer Login drücken, würde ich Fortschrittskreis über Formular anzeigen, bis Login abgeschlossen ist (und zentriert). Dies ist mein Code:

<div class="flex-container"> 
<div style="width:400px;text-align:center"> 
    <md-progress-circle mode="indeterminate" color="primary" *ngIf="showSpinner"> 

     <!-- my code for login form --> 
    </md-progress-circle> 

</div> 
</div> 

Jetzt, wenn ich app starten, kann ich nicht Login-Formular sehen. md-progress-circle geht über mein Login-Formular, in der Tat, wenn ich * ngIf Zustand entferne, kann ich nur einen Kreis sehen, aber kein Formular. Was ist los?

Answer 1

Sie haben das Login-Formular innerhalb md-progress-circle, deshalb ist es nicht sichtbar. Jeder Inhalt zwischen <md-progress-circle></md-progress-circle> Tag wird von der Komponente ignoriert. Sie sollten das Anmeldeformular und md-progress-circle separat so halten,

<div class="flex-container"> 
<div style="width:400px;text-align:center"> 
    <md-progress-circle mode="indeterminate" 
         color="primary" 
         *ngIf="showSpinner"> 
    </md-progress-circle> 
    <div *ngIf="!showSpinner"> 
     <!-- my code for login form --> 
    </div> 
</div> 
</div>