ngIf未显示ngModel更改的md-select

Question

这一直工作到Angular 4.3.2+ - 不知道为什么Md-Select没有显示。 {{ 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

根据您对问题的解释来判断，您误解了ngIf的作用。 display: none不是来自ngIf。 ngIf完全删除或添加元素到DOM;它不会隐藏或显示CSS属性。

如果传递给ngIf的条件评估为false或者是假值，则您甚至不会在开发工具中看到该元素。

Answer 2

这是AngularJS ^4.0.0和/或Material

的错误

场景：如果*ngIf放置在Material组件上或是display: none组件的直接父级，则组件将以.parent-class .md-component { display: inline-block !important }作为内联样式。

解决方案1 ​​

md-component

解决方案2

将任何元素放置为<span>的直接父级 - 甚至添加{{1}}标记也可以解决问题。