How to retrieve uploaded file value in ts


#1

in html

<input type="file" [(ngModel)]="files" (change)="retriveFiles()" name="filesName" id="newsFiles" multiple accept="image/*,video/*" />

in ts how I am supposed to get not getting

 retriveFiles(event:Event){
     let filesName: FileList = this.nativeInputBtn.nativeElement.filesName;
    console.log(this.filesName);
  }

cannot read property of undefined nativeElement not getting and went through lot of examples plz help


#2

Add an $event parameter to the (change) handler. It will be an HTMLInputElement.


#4

getting this error
Cannot read property ‘nativeElement’ of undefined

this is how I am intialising

private nativeInputBtn: ElementRef;
let filesName: FileList = this.nativeInputBtn.nativeElement.filesName;

my elementRef Code

export declare class ElementRef {
    nativeElement: any;
    constructor(nativeElement: any);
}

#5

That’s lovely. Did you do what I recommended about adding an $event parameter to your change handler?


#6

Yes bro did the same


#7
<input type="file" [(ngModel)]="files" (change)="retriveFiles($event)" name="filesName" id="newsFiles" multiple accept="image/*,video/*" />

same as above u recommend


#8

Then why aren’t you using the parameter in the change handler instead of bothering with all this nativeInputBtn stuff?


#9

retriveFiles($event){
console.log(JSON.stringify($event)); // printing in console {“isTrusted”:true}
}

here I want to know how do I get file value so that I can upload that