Reset filter value on primeNG table

Fixed it here

For input fields just add

[value]="dt.filters[<field>] ? dt.filters[<field>].value : ''" 

where <field> is the field send in the (input) method.

 (input)="dt.filter($event.target.value,<field>, 'contains')"

For example:

    <th>
      <input pInputText type="text" (input)="dt.filter($event.target.value, 'date', 'contains')"
       [value]="dt.filters['date'] ? dt.filters['date'].value : ''">
    </th>

What if you just add ngModel to your inputs like:

<input pInputText type="text" [(ngModel)]="dt22" (input)="dt.filter($event.target.value, 'date', 'contains')">

in code you'll define:

  dt22:string = '';

and then onClick will be:

onClick() {
    this.dt22 = '';
    this.table.reset();
  }

I know that this will require additional code, but this will definitely work (a just tried on your stackblitz code)