Угловой декоратор, который применяет оформленный метод в качестве обработчика событий окна
Я пытаюсь добиться декоратора методов, который я хочу применить к таким методам:
@indicatesUnsavedChanges()
hasUnsavedChanges(): boolean {
console.log('Came in component implementation.');
return this.childComponent.isInEditMode;
}
Затем декоратор должен применить обработчик событий к окнам beforeunload
событие, чтобы проверить, есть ли несохраненные изменения или нет. Реализация декоратора выглядит следующим образом:
export function indicatesUnsavedChanges(): MethodDecorator {
return function (target: any, key: string, descriptor: any) {
console.log('prevent loss of unsaved applied');
const originalMethod = descriptor.value;
window.onbeforeunload = (event) => {
if (originalMethod.call(target)) {
event.returnValue = 'There are unsaved changes. You my want to prevent unloading this page.';
}
};
}
}
Как видите, у меня есть дочерний компонент, который может находиться в разных состояниях. Впрыскивается @ViewChild(ChildComponent) childComponent: ChildComponent;
и он работает как чудо при использовании компонента, но когда срабатывает обработчик событий childComponent
не определено, хотя this
определяется, и он имеет правильный тип, и у него есть все методы, но не это свойство.
Я предполагаю, что целевой параметр является своего рода снимком и не имеет ссылки на компонент. И пока childComponent
вводится после применения декоратора, свойство не существует.
Я также пытался использовать это везде в реализации декоратора, но оно всегда не определено (или это окно в обработчике событий). Далее я попытался предоставить контекст в качестве параметра, подобного этому:
@indicatesUnsavedChanges(this)
hasUnsavedChanges(): boolean { ... }
а также
export function indicatesUnsavedChanges(context: any): MethodDecorator {
...
if (originalMethod.call(context)) {
...
но безуспешно Ошибка была та же: childComponent
был неопределен.
У вас есть подсказка, как заставить мой подход работать?
PS: используя @HostListener
это не вариант в моем сценарии.