angular-directives
  1. Directives
  2. AvatarBackgroundImageDirective

File

src/lib/avatar-background-image.directive.ts

Extends

BackgroundImageDirective

Metadata

Selector [rxapAvatarBackgroundImage]
Standalone true

Index

Properties
Inputs
Accessors

Constructor

constructor(host: ElementRef, renderer: Renderer2, imageLoader: ImageLoaderService, avatarImage: AvatarImageService)
Defined in src/lib/avatar-background-image.directive.ts:26
Parameters :
Name Type Optional
host ElementRef No
renderer Renderer2 No
imageLoader ImageLoaderService No
avatarImage AvatarImageService No

Inputs

name
Type : string
Defined in src/lib/avatar-background-image.directive.ts:42
rxapAvatarBackgroundImage
Type : string | null | undefined
Default value : null
Defined in src/lib/avatar-background-image.directive.ts:24
placeholderImageUrl
Type : string
Inherited from BackgroundImageDirective
Defined in BackgroundImageDirective:61
position
Type : BackgroundPosition
Inherited from BackgroundImageDirective
Defined in BackgroundImageDirective:70
repeat
Type : BackgroundRepeat
Inherited from BackgroundImageDirective
Defined in BackgroundImageDirective:67
rxapBackgroundImage
Type : string | null | undefined
Default value : null
Inherited from BackgroundImageDirective
Defined in BackgroundImageDirective:58
size
Type : BackgroundSize
Inherited from BackgroundImageDirective
Defined in BackgroundImageDirective:64

Properties

Public repeat
Default value : BackgroundRepeatOptions.NO_REPEAT
Defined in src/lib/avatar-background-image.directive.ts:26
Public size
Default value : BackgroundSizeOptions.COVER
Defined in src/lib/avatar-background-image.directive.ts:25

Accessors

name
setname(name: string)
Defined in src/lib/avatar-background-image.directive.ts:42
Parameters :
Name Type Optional
name string No
Returns : void 
import {
  Directive,
  ElementRef,
  Inject,
  Input,
  Renderer2,
} from '@angular/core';
import {
  AvatarImageService,
  ImageLoaderService,
} from '@rxap/services';
import {
  BackgroundImageDirective,
  BackgroundRepeatOptions,
  BackgroundSizeOptions,
} from './background-image.directive';

@Directive({
  selector: '[rxapAvatarBackgroundImage]',
  standalone: true,
})
export class AvatarBackgroundImageDirective extends BackgroundImageDirective {
  @Input('rxapAvatarBackgroundImage')
  public override imageUrl: string | null | undefined = null;
  public override size = BackgroundSizeOptions.COVER;
  public override repeat = BackgroundRepeatOptions.NO_REPEAT;

  constructor(
    @Inject(ElementRef)
      host: ElementRef,
    @Inject(Renderer2)
      renderer: Renderer2,
    @Inject(ImageLoaderService)
      imageLoader: ImageLoaderService,
    @Inject(AvatarImageService)
    private readonly avatarImage: AvatarImageService,
  ) {
    super(host, renderer, imageLoader);
  }

  @Input()
  public set name(name: string) {
    if (!this.placeholderImageUrl) {
      this.placeholderImageUrl = this.avatarImage.get({ name });
    }
  }
}

results matching ""

    No results matching ""