Prime Modal无法打开

Question

我在Angular 2中创建了一个主要的NG模态。它应该在单击一个按钮时打开，该按钮调用下面的toggleDeleteModalDisplay方法，但它似乎没有打开。不知道我做错了什么，因为我在代码中有其他模态基本相同

import { Component, ViewEncapsulation, Injectable } from '@angular/core';

@Component({
    selector: 'delete-user',
    templateUrl: './delete-user.component.html',
    encapsulation: ViewEncapsulation.None,
})

export class DeleteUserComponent {

    public deleteModalDisplay : boolean = false;

    public toggleDeleteModalDisplay() : void {
           this.deleteModalDisplay = !this.deleteModalDisplay;
    }

}

<p-dialog [(visible)]="deleteModalDisplay" [width]="500"
          [draggable]="false" [modal]="true" [dismissableMask]="true"
          class="delete-user-modal">
    <p-header class="header-modal">
        Delete User
    </p-header>
</p-dialog>

import { DeleteUserComponent } from './delete-user/delete-user.component';


@Component({
    templateUrl: './manage-users.component.html',
    styleUrls: ['./manage-users.component.less'],
})
export class ManageUsersComponent {
    constructor(public deleteUserComponent: DeleteUserComponent) {}

    public deleteUser() : void {
      this.deleteUserComponent.toggleDeleteModalDisplay();
    }
 }