javascript - 如何存储异步回调函数的变量

Question

我正在开发一个 chrome 扩展，我正在尝试在插件内的 textarea 中的选项卡上输出选定的文本。

获取所选文本的功能效果很好，但我无法将值设置为插件内的 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]所以我想我尝试存储数据的方式不正确，但我似乎找不到将其更改为的内容。

标签： javascriptangulartypescriptecmascript-6

Answer 1

在您当前的方法中，this不引用您的组件。

更改您的回调以使用箭头函数来保持范围：

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