Image utilizes the native HTML <img>
element to display responsive images on a page and prevent content jumping while images are loading.
import { DaffImageComponent } from '@daffodil/design/image'
@Component()
class DaffImageComponent implements OnInit {
@Input() src: string
@Input() alt: string
@Input() width: number
@Input() height: number
@Output() load: EventEmitter<void> = new EventEmitter()
}
string
Default | – |
---|---|
Description | The URL of the image. |
string
Default | – |
---|---|
Description | The alternate text for the image. |
number
Default | – |
---|---|
Description | The width of the image. |
number
Default | – |
---|---|
Description | The height of the image. |
EventEmitter<void>
Default | – |
---|---|
Description | Emits when the image has loaded. |
import { DaffImageModule } from '@daffodil/design/image'
@NgModule()
class DaffImageModule {}