Receive "Tried to encode an unsaved file" when trying to add user avatar image

I am using Moralis in my Angular 11 app and I’m trying to add the functionality for user to add their user image. but when I add an image, I receive this error in my console:

core.js ERROR Error: Uncaught (in promise): Error: Tried to encode an unsaved file.
Error: Tried to encode an unsaved file.

This is my html:


and this is my typescript:

    const uploadedFile = this.el.nativeElement;
    if (uploadedFile.files.length > 0) {
      const file = uploadedFile.files[0];
      const name = 'avatar.jpg';
      const avatar = new Moralis.File(name, file);


This is changeAvatar method in Moralis service:

  changeAvatar(avatar: any): void {
    this.currentUser.set('avatar', avatar);;

you may need to save the file after the first line

1 Like

Okay. how do i do that?

you can use something like

1 Like

Thank you so much it’s fixed now.