3

I am needing a switch statement, and depending on the type of file uploaded, I want to change the background of the uploader to represent the file type (pdf, doc, txt, etc...).

So, <lightning:icon iconName="doctype:pdf" /> in the component doesn't really work since the icon is just there...

How do I, in the javascript controller of a Lightning component, access these icons and set the background of an element, or src of an image to these icons programmatically?

Improve this question

2 Answers 2

Reset to default
2

The assets for Lightning are stored under "/apexpages/slds/latest/"; just get the icon part from the SLDS documentation for Icons with this path prepended to the file URL.

Improve this answer
3

Bind iconName as an attribute. So:

<aura:attribute name="calculatedIconName" type="string"/>

<lightning:icon iconName="{! v.calculatedIconName }" />

Then set it after uploading function resolves.

Improve this answer
3
  • That does work, and gets closer to what I am after. However, I am wanting to set the background of an element to an SLDS icon. I would prefer to use the built in SLDS icons instead of creating some static resource to house all the images.
    – Tyler Dahle
    Commented Mar 23, 2018 at 16:07
  • ah, in that instance i would think you would want to host SLDS icons in a static image on the off chance salesforce changes their url to the direct icon link the other poster was referring to.
    – tsalb
    Commented Mar 23, 2018 at 19:56
  • Yeah, I was thinking about that as well, that it may be wise to host them in a static resource to prevent losing them if that url does ever change. But at the moment the URL sfdcfox posted will suffice. Thank you for the help. Your post is a nice trick that I'll have to remember.
    – Tyler Dahle
    Commented Mar 23, 2018 at 21:04

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .