実行時にngIFのfalse値が無視される

Question

DOM内に要素を持ってきたが、そこから外に出ないために、* ngIf命令が使用されています。以下のコードを使用すると、親コンポーネントから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> 

親コンポーネント：

奇妙なことに、エッジとChromeの両方でDOMエクスプローラがngIfが正しくfalseに設定されていることを示しています

showGlobalDialog上の（）：hideGlobalDialog上

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

（）：

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

しかし、上記のバインディングコメントを使用しても、要素は引き続き表示されます。 'isVisible'がfalseのときにDOMに要素を存在させたくないので、[hidden]への移動はオプションではありません。

Answer 1

Webサーバーの再起動で問題が解決し、すべて正常に機能しました。