MOBILE-3814 chore: Use WaitToBeInDom on OnAppear directive
parent
23cfb29de0
commit
0d01449393
|
@ -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));
|
||||||
this.subscriptions.push(outlet.activateEvents.subscribe(onOutletUpdated));
|
|
||||||
|
|
||||||
onOutletUpdated();
|
|
||||||
|
|
||||||
onOutletUpdated();
|
onOutletUpdated();
|
||||||
|
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
|
|
||||||
import { Directive, ElementRef, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core';
|
import { Directive, ElementRef, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core';
|
||||||
import { CoreDomUtils } from '@services/utils/dom';
|
import { CoreDomUtils } from '@services/utils/dom';
|
||||||
|
import { CoreSingleTimeEventObserver } from '@singletons/events';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Directive to listen when an element becomes visible.
|
* Directive to listen when an element becomes visible.
|
||||||
|
@ -26,7 +27,7 @@ export class CoreOnAppearDirective implements OnInit, OnDestroy {
|
||||||
@Output() onAppear = new EventEmitter();
|
@Output() onAppear = new EventEmitter();
|
||||||
|
|
||||||
private element: HTMLElement;
|
private element: HTMLElement;
|
||||||
private interval?: number;
|
protected domListener?: CoreSingleTimeEventObserver;
|
||||||
|
|
||||||
constructor(element: ElementRef) {
|
constructor(element: ElementRef) {
|
||||||
this.element = element.nativeElement;
|
this.element = element.nativeElement;
|
||||||
|
@ -35,24 +36,18 @@ export class CoreOnAppearDirective implements OnInit, OnDestroy {
|
||||||
/**
|
/**
|
||||||
* @inheritdoc
|
* @inheritdoc
|
||||||
*/
|
*/
|
||||||
ngOnInit(): void {
|
async ngOnInit(): Promise<void> {
|
||||||
this.interval = window.setInterval(() => {
|
this.domListener = CoreDomUtils.waitToBeInDOM(this.element);
|
||||||
if (!CoreDomUtils.isElementVisible(this.element)) {
|
await this.domListener.promise;
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.onAppear.emit();
|
this.onAppear.emit();
|
||||||
window.clearInterval(this.interval);
|
|
||||||
|
|
||||||
delete this.interval;
|
|
||||||
}, 50);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @inheritdoc
|
* @inheritdoc
|
||||||
*/
|
*/
|
||||||
ngOnDestroy(): void {
|
ngOnDestroy(): void {
|
||||||
this.interval && window.clearInterval(this.interval);
|
this.domListener?.off();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue