Accepted file types not working with data binding

[krava11i]

Hello there,

Thank you for this nice extension. I am using it in a current project for a general reusable file upload component. In this component it should be possible to dynamically load the accepted file type via a signal input. My problem with this is that i can't get it to work when I try to bind the accept attribute and not statically set it in the template. Please see my example below. When I use it with a data binding the value for accept only appears in a ng-reflect-accept attribute.

<mat-form-field appearance="outline">
    <mat-label>Label</mat-label>
    <ngx-mat-dropzone>
      <input type="file" [accept]="acceptedFormats()" fileInput [formControl]="uploadControl" />
      @if (uploadControl.value) {
        <mat-chip-row (removed)="uploadControl.setValue(null)">
          {{ uploadControl.value.name }}
          <button mat-icon-button matChipRemove>
            <mat-icon>cancel</mat-icon>
          </button>
        </mat-chip-row>
      }
    </ngx-mat-dropzone>
  </mat-form-field>

I looked at your source code where you use the @Input with get/set for the accept attribute. I tried a similar implementation in one of my components to understand the problem but it worked perfectly fine when I used it with a data binding. So I don`t know where my problem comes from.

Am I doing something wrong here or is there a problem in the implementation? Can you reproduce this error?

Thank you in advance!

[hackingharold]

Hey @krava11i,

thanks for the bug report. Can you provide a StackBlitz example or any other reproduction I can run directly?

[krava11i]

Hey @hackingharold thanks for the quick reply. Sure, here is a stackblitz example which reproduces my problem. I want the upload field to only accept .zip files but it still accepts all formats and writes the .zip in the ng-reflect-attribute.

https://stackblitz.com/edit/stackblitz-starters-1ibnpy

I also tried to bind different types to the attribute e.g. a const variable, so it should not be because of the signal input.

[hackingharold]

Hi @krava11i,

it was indeed a bug with the library. The host binding was missing, therefore the accept=".zip" attribute was working, but [accept]="acceptedFormats" was not.

Please check out v18.1.1 and see if this fixes your error.

[krava11i]

Thank you for the quick fix. I checked it and now it works perfectly fine!