We are using apex:image tag to show an image in Visualforce page. However referring image in lightning component is slightly differ from Visualforce page.
Here is the example for how to show or refer an image from static resource file in lightning component,
Example
- <aura:component >
- <img src="http://www.robotmag.com/images/frontpage.jpg"/>
- </aura:component>
Directly referred public image from online source.
Resource Example
- <aura:component >
- <img src="/resource/ImageLibrary" height="50" width="200"/>
- </aura:component>
Where "ImageLibrary" is the Static Resource name.
Zip Resource Example
- <aura:component >
- <img src="/resource/ImageLibrary/images/techno.jpg" title="Welcome to tech world"/>
- </aura:component>
ImageLibrary - Static Resource name.
images - Folder name.
techno.jpg - Image file name.
Note: Referring Folder name and file name is case sensitive.
I have multiple images and I need to display the correct one based on the Status field. Any thoughts on how I could add some conditional logic to display the right image?
ReplyDeletefor example if c.status = new, i want the component to display NEW.jpg, but if c.status = OLD I want to display OLD.jpg.
thoughts?
Did you builded this logic? If yes cpuld you please share us the info
Deletethis can be done using aura:if, like you can call the new one in the if condition and the old one in the else part
ReplyDeletecan we check condition in js controller? can any give me example or snippet for this
ReplyDelete