Как сохранить переменную функции асинхронного обратного вызова

Question

Я занимаюсь разработкой расширения для Chrome и пытаюсь вывести выделенный текст на вкладку в текстовой области внутри плагина.

Функция для получения выделенного текста работает очень хорошо, но я не могу установитьзначение элемента textarea внутри плагина.

Вопрос: Как правильно сохранить значение, чтобы можно было затем передать его текстовой области с привязкой данных?

HTML:

<div>
    <p>Here will appear the selected text :</p>
    <textarea name="selectedText" id="selectedText" [(ngModel)]="selectedText"></textarea>
    <button (click)="getSelectedText()">Get the selected text</button>
</div>

TS:

export class CaptureComponent {
    selectedText = '';

    getSelectedText() {
        chrome.tabs.executeScript( {
            code: 'window.getSelection().toString();'
        }, function(selection) {
            this.selectedText = selection[0];
        });
    }
}

selection[0] работает нормально, так что я думаю, что способ, которым яЯ пытаюсь сохранить данные неверно, но я не могу найти, что их изменить.

Answer 1

В вашем текущем подходе this не относится к вашему компоненту.

Измените свой обратный вызов, чтобы использовать функцию стрелки, чтобы сохранить область действия:

getSelectedText() {
   chrome.tabs.executeScript( {
     code: 'window.getSelection().toString();'
     }, (selection) => {
       this.selectedText = selection[0];
    });
}