ngIf不显示ngModel更改上的md-select。

Question

这是工作直到角4.3.2+ -不知道为什么Md-选择是没有显示。{{ selected }}吐出了category，我确信这一点。

<md-select formControlName="category" name="category"  
      placeholder="Categories" *ngIf="selected === 'category'">
    <md-option *ngFor="let cat of categories" [value]="cat.value">
        {{ cat.viewValue }}
    </md-option>
</md-select>

当我检查md-select元素时，它有一个随机的display: none内联。

Answer 1

这是一个带有AngularJS ^4.0.0和/或Material的bug

场景:如果*ngIf被放置在Material组件上或它是Material组件的直接父级，则该组件将获得一个display: none作为内联样式。

解决方案1

.parent-class .md-component { display: inline-block !important }

解决方案2

将任何元素作为md-component的直接父元素--甚至添加一个<span>标记也为我解决了这个问题。

Answer 2

从你对这个问题的解释来看，你误解了ngIf所做的事情。display: none不是来自ngIf。ngIf完全将一个元素移除或添加到DOM中；它不会隐藏或使用CSS属性显示元素。

如果传递给ngIf的条件计算为false，或者一个falsy值，那么您甚至不会在dev工具中看到这个元素。