Запустить событие на хосте из директивы

Question

Я пытаюсь автоматически закрыть NG Bootstrap alert по истечении заданного периода времени.В предупреждении уже есть событие закрытия, которое я использую в компоненте.Я добавляю дополнительную функцию тайм-аута в качестве директивы, которая должна иметь возможность инициировать само событие закрытия.Примерно так?

close-on-timeout.directive.ts

import { Directive, ElementRef, HostBinding, Input, OnInit } from '@angular/core';

@Directive({
  selector: '[appCloseOnTimeout]'
})
export class CloseOnTimeoutDirective implements OnInit {
  @Input() appCloseOnTimeout: number;
  @HostBinding('close') close: CloseEvent;

  constructor () {}

  ngOnInit () {
    setTimeout (() => this.close(), this.appCloseOnTimeout);
  }
}

Я хочу использовать директиву следующим образом:

<ngb-alert
  [dismissible]="alert.dismissible"
  [type]="alert.type"
  (close)="onClose(i)"
  [appCloseOnTimeout]="1000"
>

Какой лучший способ получить доступ к событию close элемента host?Я попытался использовать ElementRef вместо этого, но все еще не могу найти способ доступа к событиям.

Answer 1

Почему бы не EventEmitter?

import {
  Directive,
  ElementRef,
  HostBinding,
  Input,
  OnInit,
  Output,
  EventEmitter
} from '@angular/core';

@Directive({
  selector: '[appCloseOnTimeout]'
})
export class CloseOnTimeoutDirective implements OnInit {
  @Input() appCloseOnTimeout: number;
  @Output() close: EventEmitter = new EventEmitter();

  constructor() {}

  ngOnInit() {
    setTimeout(() => this.onClose(), this.appCloseOnTimeout);
  }
  
  onClose() {
    console.log('local close');
    this.close.emit();
  }
}

Answer 2

Используйте что-то вроде ...

import { Directive, ElementRef, HostBinding, Input, OnInit, Output, EventEmitter } from '@angular/core';

@Directive({
 selector: '[appCloseOnTimeout]'
})
export class CloseOnTimeoutDirective implements OnInit {
 @Input() appCloseOnTimeout: number;
 @Output() close:EventEmitter<any> = new EventEmitter();

 constructor () {}

 ngOnInit () {
  setTimeout (() => this.closeWrapp(), this.appCloseOnTimeout);
 }

 closeWrapp(){
  this.close.emit()
 }
}