A lightning:formattedText component displays a read-only representation of text, wrapping URLs and email addresses in anchor tags (also known as "linkify"). It also converts the \r or \n characters into <br /> tags.
To display URLs and email addresses in a block of text in anchor tags, set linkify="true". If not set, URLs and email addresses display as plain text. Setting linkify="true" wraps URLs and email addresses in anchor tags with format="html" scope="external" type="new-window:HTML". URLs and email addresses are appended by http:// and mailto:// respectively.
<aura:component> <lightning:formattedText linkify="true" value="I like salesforce.com and trailhead.salesforce.com." /> </aura:component>
The previous example renders like this.
I like <a format="html" scope="external" type="new-window:HTML" href="http://salesforce.com">salesforce.com</a> and <a format="html" scope="external" type="new-window:HTML" href="http://trailhead.salesforce.com">trailhead.salesforce.com</a>.
Usage Considerations
lightning:formattedText supports the following protocols: http, https, ftp and mailto.
If you're working with hyperlinks and need to specify the target value, use lightning:formattedURL instead. If you're working with email addresses only, use lightning:formattedEmail.
For rich text that uses tags beyond anchor tags, use lightning:formattedRichText instead.
Attribute Name | Attribute type | Description | Required? |
---|---|---|---|
body | Component[] | The body of the component. In markup, this is everything in the body of the tag. | |
class | String | A CSS class for the outer element, in addition to the component's base classes. | |
title | String | Displays tooltip text when the mouse moves over the element. | |
value | String | Text to output. | |
linkify | Boolean | Specifies whether the text should be converted to a link. If set to true, URLs and email addresses are displayed in anchor tags. |