web-dev-qa-db-ja.com

Angular2 + TypeScript + FileReader.onLoad =プロパティが存在しません

私はFileReader Interfaceを使用しており、非同期メソッドreadAsText（）を使用してローカルテキストファイルを読み取り、その後onloadイベントが呼び出されたとき、ファイルを読み取ろうとすると、ソースコードは次のようになります。

export class ReadFileComponent {
   text: string;

   readFile(): void {
     let reader=new FileReader();
     reader.onload = function(e) {
        this.text=reader.result;
     }
     reader.readAsText(file);   
   }
}

プロパティ"text"がタイプ"FileReader"に存在しないため、コンパイルが失敗しました

これはEventListenerインターフェースがオブジェクトを受け入れないためだと思います、

誰かがこの種の問題を解決してくれましたか？

みんなありがとう、

javascriptangulartypescriptfilereader
17
da45

コールバック内でthisを使用する場合は、矢印関数を使用します。そうしないと機能しません。

reader.onload = (e) => {
    this.text=reader.result;
}

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions

47
Günter Zöchbauer

ここでは、通常のJavaScript関数を使用しています。

 reader.onload = function(e) {
        this.text=reader.result;
     }

thisは、クラスではなく関数に属します。

矢印機能を使用

reader.onload = (e)=> {
            this.text=reader.result;
         }

または

self = this;
 reader.onload = function(e) {
        self.text=reader.result;
     }
3
Suraj Rao