Office JS addHandlerAsyn c обратный вызов не выполняет angular метод компонента

Question

Я работаю над веб-надстройкой для Outlook (в Angular 5), и я реализую закрепляемую панель задач, и я следую этой документации от Microsoft: Реализация закрепляемой панели задач в Outlook .

То, что я хочу сделать, - это когда выбранная почта в Outlook была изменена, мне нужно обновить содержимое пользовательского интерфейса панели задач.

On My Component.TS Я добавил следующий обработчик событий addHandlerSyn c для изменения выбора почты:

ngOnInit() {
    Office.context.mailbox.addHandlerAsync(Office.EventType.ItemChanged, this.selectMailChanged);
}
selectMailChanged(){
    this.getPhoneNumbers() //This function gets phone numbers on the email
}

Ошибка приведенного выше кода:

this.getPhoneNumbers is not defined.

Я попытался заключить это this.getPhoneNumbers в зону (на основе Документация MS: запустить обновление пользовательского интерфейса ), но он возвращает zone.run не определен.

Как я могу вызвать angular компонентный метод для обратного вызова addHandlerAsyn c?

Answer 1

Старые добрые известные this проблемы с ключевыми словами.

Вы получаете это сообщение об ошибке из-за разницы в контексте. Когда вы пишете код, метод selectMailChanged ссылается на метод getPhoneNumbers (который, я надеюсь, он реализован) в вашем компоненте. Так что с точки зрения кодирования это выглядит хорошо.

Но когда происходит событие - у него больше нет контекста компонента, потому что он просто вызывает функцию обратного вызова - так что на самом деле он не имеет всех информация о внешнем мире, кроме функции, в которую он обращается. Вы можете прочитать несколько хороших ответов об этом ниже:

1. Как получить доступ к правильному `this` внутри обратного вызова?
2. https://thenewstack.io/mastering-javascript-callbacks-bind-apply-call/
3. https://technology.amis.nl/2016/08/23/access-the-original-calling-context-in-a-callback-function-in-typescript/

Переместите функциональность в getPhoneNumbers в метод обратного вызова, и у вас не должно быть этой проблемы.