Skip to content

Platform: Link Component Technical Design

Kevin Okamoto edited this page Feb 3, 2020 · 4 revisions

Link

Summary

Simple anchor link. See Fundamental-Styles implementation for reference.

Example

<fdp-link [href]="'#'"
    [hreflang]="'en'"
    [download]="'/path/to/download/file'"
    [media]="'print and (resolution:300dpi)'"
    [rel]="'nofollow'"]
    [target]="target"
    [type]="'text/html'">Link</fdp-link>
<fdp-link [href]="'#'"[disabled]="true">Disabled Link</fdp-link>

Property Bindings

download: String

The filename of the file which will be downloaded when the user clicks on the link.

href: String

URL of the page the link references.

hreflang: String

The language of the linked document. (e.g. 'en', 'fr', 'de', 'jp')

media: String

The media/device that the linked document is optimized for.

rel: String

The relationship between current document and linked document. (e.g. 'alternate', 'external', 'nofollow')

target: String

Specifies where to open the linked document.

type: String

The media type of the linked document.

disabled: Boolean

Sets link in "disabled" mode.

Template

<a class="fd-link" [attr.href]="href" [attr.aria-disabled]="disabled"><ng-content></ng-content></a>
Clone this wiki locally