How to change the label text in Angular Material File Upload

Question

I wanted to create a File Upload using angular material. I wanted to use this one. One thing I want to change is the name Selected File(s) they offer this [labelText] property to change the text, but it actually just changes the label text.

Here is the code that I tested:

<mat-file-upload
  [labelText]="'Test'"
  [showUploadButton]="true">
</mat-file-upload>

Is there any way to change the text of Selected Files(s) ?

Answer 1

On your component.html that uses the mat-file-upload component, you will need to bind the labelText input binding to a new property called labelText .

<mat-file-upload
  [labelText]="labelText"   
  [showUploadButton]="true">
</mat-file-upload>

And on your component.ts, you will need to initialise the property with the desired text for the labelText

labelText:string = 'Custom Text Label';

I have made a demo over here .