MOBILE-3814 chore: Use WaitToBeInDom on OnAppear directive

main
Pau Ferrer Ocaña 2022-03-14 23:10:05 +01:00
parent 23cfb29de0
commit 0d01449393
2 changed files with 7 additions and 15 deletions

View File

@ -199,9 +199,6 @@ export class CoreCollapsibleHeaderDirective implements OnInit, OnChanges, OnDest
};
this.subscriptions.push(outlet.activateEvents.subscribe(onOutletUpdated));
this.subscriptions.push(outlet.activateEvents.subscribe(onOutletUpdated));
onOutletUpdated();
onOutletUpdated();

View File

@ -14,6 +14,7 @@
import { Directive, ElementRef, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core';
import { CoreDomUtils } from '@services/utils/dom';
import { CoreSingleTimeEventObserver } from '@singletons/events';
/**
* Directive to listen when an element becomes visible.
@ -26,7 +27,7 @@ export class CoreOnAppearDirective implements OnInit, OnDestroy {
@Output() onAppear = new EventEmitter();
private element: HTMLElement;
private interval?: number;
protected domListener?: CoreSingleTimeEventObserver;
constructor(element: ElementRef) {
this.element = element.nativeElement;
@ -35,24 +36,18 @@ export class CoreOnAppearDirective implements OnInit, OnDestroy {
/**
* @inheritdoc
*/
ngOnInit(): void {
this.interval = window.setInterval(() => {
if (!CoreDomUtils.isElementVisible(this.element)) {
return;
}
async ngOnInit(): Promise<void> {
this.domListener = CoreDomUtils.waitToBeInDOM(this.element);
await this.domListener.promise;
this.onAppear.emit();
window.clearInterval(this.interval);
delete this.interval;
}, 50);
this.onAppear.emit();
}
/**
* @inheritdoc
*/
ngOnDestroy(): void {
this.interval && window.clearInterval(this.interval);
this.domListener?.off();
}
}