ngIF 错误值在运行时被忽略答案

【问题标题】：ngIF false value ignored at runtimengIF 错误值在运行时被忽略
【发布时间】：2018-02-06 07:36:54
【问题描述】：

我的 *ngIf 指令因将一个元素带入 DOM 而受到尊重，但并未将其带出。使用下面的代码，我可以成功地从父组件调用 showGlobalDialog()，但是 hideGlobalDialog() 似乎不起作用。

子组件模板：

<div class="modal" *ngIf="isVisible === true">
     <ng-content></ng-content>
</div>

子组件：

public show(): void {
    this.isVisible = true;
}

public hide(): void {
    this.isVisible = false;
}

父组件模板：

<app-mycomponent #globalDialog>
    <div>
        <button (click)="hideGlobalDialog()">Done</button>
    </div>
</app-mycomponent>

父组件：

@ViewChild('globalDialog') globalDialog: MyComponent;

    private showGlobalDialog() {
        this.globalDialog.show();
    }

    public hideGlobalDialog() {
        this.globalDialog.hide();
    }

奇怪的是，Edge 和 Chrome 中的 DOM 浏览器都显示 ngIf 正确设置为 false：

在 showGlobalDialog() 上：

<!--bindings={
  "ng-reflect-ng-if": "true"
}-->

在 hideGlobalDialog() 上：

<!--bindings={
  "ng-reflect-ng-if": "false"
}-->

但是，即使有上述绑定注释，元素仍然可见。当 'isVisible' 为 false 时，我不希望元素存在于 DOM 中，因此无法选择 [hidden]。

【问题讨论】：

标签： angular

【解决方案1】：

重新启动网络服务器最终解决了问题，一切正常。

【讨论】：