PrimeNg确认对话框无法打开

Question

我正在创建一个基本的crud应用程序。我想在用户点击删除图标时显示一个对话框，以确认他是否要删除该记录。我正在尝试使用primeng对话框但是对话框没有打开控制台也没有错误。我不知道出了什么问题。请帮忙。谢谢。

这是我的密码

export class ListuserComponent implements OnInit {

  constructor(private userService:UsersService,private dialogService:DialogService,private snackBar:MatSnackBar,private confirmationService:ConfirmationService) { }
  users: User[];
  msgs: Message[] = [];


  ngOnInit() {
    this.userService.getusers()
      .subscribe( data => {
        this.users = data;
      });
  }

  confirm1()
   {

    this.confirmationService.confirm({
        message: 'Are you sure that you want to proceed?',
        header: 'Confirmation',
        icon: 'pi pi-exclamation-triangle',
        accept: () => {
            this.msgs = [{severity:'info', summary:'Confirmed', detail:'You have accepted'}];
        },
        reject: () => {
            this.msgs = [{severity:'info', summary:'Rejected', detail:'You have rejected'}];
        }
    });
  }
}

这是我的HTML：

<div class="col-md-6">
   <p-table  #dt [value]="users" [autoLayout]="true" [globalFilterFields]="['userName','userRole']">
      <ng-template pTemplate="caption">
          <div style="text-align: right">        
              <i class="fa fa-search" style="margin:4px 4px 0 0"></i>
              <input type="text" pInputText size="50" placeholder="Global Filter" (input)="dt.filterGlobal($event.target.value, 'contains')" class="filter">
          </div>
      </ng-template>
    <ng-template pTemplate="header">
        <tr>

              <th>Id</th>
              <th>Name</th>
              <th>Class</th>
              <th></th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-user>

        <tr class="my-center-text">
            <td>{{user.id}}</td>

          <td>{{user.Name}}</td>
          <td>{{user.Class}}</td>
          <td><button mat-icon-button type="button"  matTooltip="Delete this student" matTooltipClass="example"
            (click)="confirm1()"> <mat-icon>delete_outline</mat-icon></button>
        </tr>
    </ng-template>
</p-table>
</div>

Answer 1

解决了它。不得不将p-confirmDialog标签添加到表格单元格中。

Answer 2

将以下代码添加到HTML文件中。

<p-confirmDialog header="Confirmation" icon="fa fa-exclamation-triangle" width="425"></p-confirmDialog>