Change trash icon in "File uploader" Component

[elharony]

Problem

In the File uploader component, when uploading a file, it appears with a "Trash" icon to delete an uploaded file. How can I replace it with "X" icon for example? Here's a snapshot of it:

Expected Solution

To have an option under options configuration object called delete-button, and it should accept a Node Element.

[Phil147]

Hi @elharony

it is currently not possible to change the icon directly on the component API as this is how it is defined in the design spec.

You could do a little trick though and use how the dependency injection of Angular works. You could create a wrapper component around the file uploader and provide the icon registry there again which will give you a new instance. And then you can override the trash icon with something else :)

Here's a little stackblitz: https://stackblitz.com/edit/file-upload-icon?file=src/app/my-file-uploader/my-file-uploader.component.ts

When I add a file it looks like this:

Hope that helps you for now 👍

In general what we provide here is pretty limited I agree. There are other use cases being discussed in the team so that might see some changes in the future. Could be that we support more configuration options or basically leave it to the developers to create the list on their own to add additional features and make it possible to opt out of the included default file list. We will consider your request when we get these changes.

[elharony]

It works, thank you @Phil147 ! I guess it would be better to keep the additional features list it to the developers' requests, so we don't add redundant/not-used configuration and makes it harder, not easier.

Once again, thanks for taking my request into consideration, and I would love to share any further improvements with you.

[Phil147]

Hey @elharony

as an fyi: it is now possible to use a custom template for the item rows, see https://aposin.github.io/ng-aquila/documentation/file-uploader/overview#custom-item-template

[elharony]

Thanks, @Phil147!