Question

我的* ngIf指令非常荣幸能够将一个元素引入DOM，但不会将其引入DOM。使用下面的代码，我可以从Parent Component成功调用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"
}-->

on hideGlobalDialog（）：

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

但是，即使使用上述绑定注释，元素仍然可见。当＆＃39; isVisible＆＃39;时，我不希望元素存在于DOM中。是假的，所以转移到[隐藏]不是一个选择。

Answer 1

重新启动Web服务器最终修复了问题，一切正常。

在运行时忽略ngIF false值

1 个答案: