Angular 启动可恢复p-dialog组件

在我的angular应用程序中，我想创建一个Priming p-dialog组件，它可以在不同的组件之间重复使用。 下面是我的实现，但是p-dialog组件并没有显示为弹出窗口（作为对话框），而是显示在父组件的下面

log-component.html

<app-primeng-dialog 
    [isvisible]="showDialog">
</app-primeng-dialog> 
    

<div>
    <div *ngIf="isvisible">
        <div class="col-md-12 text-center p-1">
            <p-dialog [(visible)]="isvisible" [modal]="true" [responsive]="true"
                [style]="{width: '250px', minWidth: '100px', height:'350px', 'text-align': 'center'}" [minY]="70"
                [maximizable]="false" [baseZIndex]="10000" [closeOnEscape]="true" [closable]="false" position="top">
                <button type="button" pButton  label="Ok" class="ui-button"></button>
                &nbsp;
                <button type="button" pButton label="Cancel" class="ui-button"></button>

            </p-dialog>
        </div>
    </div>
</div>

DialogComponent.ts

showDialogWindow() 
{
this.showDialog  = true;
}

export class DialogComponent implements OnInit {
  @Input isvisible;
  ngOnInit() {
  }

}

DialogComponent.html

<app-primeng-dialog 
    [isvisible]="showDialog">
</app-primeng-dialog> 
    

<div>
    <div *ngIf="isvisible">
        <div class="col-md-12 text-center p-1">
            <p-dialog [(visible)]="isvisible" [modal]="true" [responsive]="true"
                [style]="{width: '250px', minWidth: '100px', height:'350px', 'text-align': 'center'}" [minY]="70"
                [maximizable]="false" [baseZIndex]="10000" [closeOnEscape]="true" [closable]="false" position="top">
                <button type="button" pButton  label="Ok" class="ui-button"></button>
                &nbsp;
                <button type="button" pButton label="Cancel" class="ui-button"></button>

            </p-dialog>
        </div>
    </div>
</div>

---

我不知道您为什么会面临这样的问题，但我有一个工作示例，说明您的代码运行良好。请检查下面stackblitz的链接=>

---

注意：不要在

对话框组件

中将

显示对话框

设置为false。如果这样做，则弹出模式将显示一次，然后不再显示。这就是为什么我使用了

@Output（）deleteSelf=neweventemitter（）。
您可以共享您的
app.module.ts
文件吗？