Angular2: using md-progress-circle

Question

我正在尝试在Angular2应用程序上使用MD-Progress-Circle。我有一个登录表单组件，当用户按下登录时，我会在表单上显示进度圆圈，直到登录完成（并以中心为中心）为止。这是我的代码：

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

现在，如果我启动应用程序，我看不到登录表单。MD-Progress-Circle越过我的登录表单，实际上，如果我删除 *NGIF条件，我可以看到Oonly Circle，但没有形式。怎么了？

Answer 1

您已将登录表单放入md-progress-circle中，这就是为什么不可见。<md-progress-circle></md-progress-circle>标签之间的任何内容都将被组件忽略。您应该保留登录表单，而md-progress-circle则像这样分开，

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