角4黄金纳克定制confirmDialog体

Question

我试图用NG-模板方法从黄金纳克 https://www.primefaces.org/primeng/#/confirmdialog

定制确认对话框的身体，但在html没有出现 这里是我的代码：

<p-confirmDialog header="Enter PIN" icon="fa fa-question-circle" width="425" #cd> 
    <ng-template pTemplate="body"> 
    <ul> 
     <li>test</li> 
    </ul> 
    </ng-template> 
    <p-footer> 

     <button type="button" pButton icon="fa-close" label="No" (click)="cd.reject()"></button> 
     <button type="button" pButton icon="fa-check" label="Yes" (click)="cd.accept()"></button> 
    </p-footer> 
</p-confirmDialog> 

我的服务呼叫

this.confirmationService.confirm({ 
     message: null, 
     header: null, 
     icon: null, 
     accept:() => { 
      this.checkCurrentCompliance('fp'); 
     } 
    }); 

我不知道我的定义到p模板是错误的 顺便说一句，我试图插入HTML使用消息变量，但它不会让我添加内联样式。

Answer 1

试试这个：

<p-confirmDialog header="Enter PIN" icon="fa fa-question-circle" width="425" #cd> 
    <p-footer> 
     <button type="button" pButton icon="fa-close" label="No" (click)="cd.reject()"></button> 
     <button type="button" pButton icon="fa-check" label="Yes" (click)="cd.accept()"></button> 
    </p-footer> 
</p-confirmDialog> 

component.ts

export class HomeComponent implements OnInit { 

    message: any; 

    constructor(private confirmationService: ConfirmationService) { } 

    ngOnInit() { 
     this.message = document.getElementsByClassName('ui-confirmdialog-message')[0].innerHTML = "<ul><li>test</li></ul>"; 
    } 

    confirm() { 
     this.confirmationService.confirm({ 
      message: this.message, 
      header: null, 
      icon: null, 
      accept:() => { 
       this.checkCurrentCompliance('fp'); 
      } 
     }); 
    } 

}