Search code examples
ng-zorro-antd

nz-popconfirm remove default icon

I am implementing a nz-popconfirm, is working fine, but I need to change the default icon, which I understand comes from an svg directly from the import of the nz-popconfirm, I have no idea how to do it. If you have any suggestions are welcome

<i nz-icon="user-delete" nzType="delete" nzTheme="fill"
nz-popconfirm nzPopconfirmTitle="Are you sure do you want to delete the User?" nzOkText="yes" nzCancelText="No" (nzOnConfirm)="deleteUser(user.user_id)" (nzOnCancel)="cancelDelete()"
nzPopconfirmPlacement="left" nz-button></i>

enter image description here

Solution

  • You can use the nzIcon Input parameter like this.

    <a
   nz-popconfirm
   nzPopconfirmTitle="Are you sure delete this task?"
   [nzIcon]="iconTpl"
   nzPopconfirmPlacement="bottom"
   (nzOnConfirm)="confirm()"
   (nzOnCancel)="cancel()">
     Delete
</a>

<ng-template #iconTpl>
   <i nz-icon nzType="question-circle-o" style="color: red;"></i>
</ng-template>

    Here is the Stackblitz working example https://stackblitz.com/edit/angular-4mfgoe?file=src/app/app.component.ts