Как сделать событие onload в Angular 5

Question

Я пытаюсь вызвать элемент onload функции, например, onload = "function ()" в Javascript.

Так что это код

<div class="img-circle" [id]="pet.id" (load)="imgLoad( pet.id, pic )"></div>

Функция работает нормально, я пытаюсьс (щелчок) и работает, но я пытаюсь с (загрузить), (загрузить), (загружен) и не работает.

Answer 1

Попробуйте HostListener.

@HostListener('document:click', ['$event'])
runThisMethod() {
  // your code goes here.
}

Если щелкнуть мышью по документу, запустите этот метод. Однако для пользовательского div используйте директивы + HostListener. Например:

<app-myComponent appChbgcolor> {{title}} </app-myComponent>
    @Directive({
        selector: '[appChbgcolor]'
    })

    export class ChangeBgColorDirective {
        constructor(private el: ElementRef, private renderer: Renderer) {
            this.ChangeBgColor('red');
        }

        ChangeBgColor(color: string) {
            this.renderer.setElementStyle(this.el.nativeElement, 'color', color);
        }

        @HostListener('onload') onClick() {
           window.alert('Host Element Clicked');
        }
    }

Answer 2

Правильным способом замены функции загрузки является использование ngOnInit. Просто внедрите OnInit в компонент приложения.

Подробнее: https://angular.io/api/core/OnInit

Answer 3

В своей функции я пытался применить стиль в этом div, параметры должны были установить background-image: url (base64);

Итак ... я перехожу на это, и работает

[ngStyle]="{ 'background-image': 'url(' + pic + ') '}

Привязка к событию (загрузка, загрузка, загрузка) не существует.