私はTypeScriptが初めてです。デュランダルアプリケーションでは、VS-2012からVS-2015に移行しましたが、これはTypeScript 0.9からTypeScript 1.8.4を意味します。移行後、非常に多くのビルドエラーが発生しました。 1つを除くすべてを解決しました。イベントの種類でビルドエラーが発生します。
エラー: "ビルド:プロパティ 'result'はタイプ 'EventTarget'に存在しません"
また、コードは次のようになりました。
var reader:any,
target:EventTarget;
reader= new FileReader();
reader.onload = function (imgsrc){
var fileUrl = imgsrc.target.result;
}
「Imgsrc」はタイプイベントを取得しています。
TypeScript 0.9では正常に動作しますが、1.8.4では、「結果」がタイプ「EventTarget」に存在しないため、エラーがスローされます。誰でもこれを解決するのに役立ちますか?.
注: "target:EventTarget"はlib.d.tsから取得しています
any
は薬です(ほとんどすべてのものですが、TypeScriptのメリットはどこにありますか)...同様の問題が報告されており、Nice(TypesScript-ish)回避策が提案されています
引用させてください:
私はこのTS2339に遭遇しました:プロパティ 'result'はJS FileReader onloadのタイプ 'EventTarget'に存在せず、FileReaderのonerrorに渡されたイベントのgetSummary()に対する別の警告です。
私の回避策は、恐ろしい赤い波線を抑制するためです;-)は次のとおりです:
interface FileReaderEventTarget extends EventTarget { result:string } interface FileReaderEvent extends Event { target: FileReaderEventTarget; getMessage():string; }
次に、私のアプリで:
reader.onload = function(fre:FileReaderEvent) { var data = JSON.parse(fre.target.result); ... }
そして、lib.d.tsに何らかの変更が加えられるまで、既知のインターフェースで作業を続けます。
event.target.result
を使用する代わりに、FileReader.result
を使用できます。
例えば、
const fileReader: FileReader = new FileReader();
fileReader.onload = (event: Event) => {
event.target.result; // This is invalid
fileReader.result; // This is valid
};
私の古いタイプのスクリプトでは、パラメータ「imgsrc」はデフォルトで任意のタイプを持っています。
それで、(imgsrc:any)として作成しました。それはうまく機能しています。
var reader:any,
target:EventTarget;
reader= new FileReader();
reader.onload = function (imgsrc:any){
var fileUrl = imgsrc.target.result;
}
問題はTypeScript定義にあります。簡単なチートは次のとおりです。
let target: any = e.target; //<-- This (any) will tell compiler to shut up!
let content: string = target.result;
期待するタイプをTypeScriptに知らせてください。
修正方法は次のとおりです。
let reader = new FileReader();
reader.onload = function (event){
let fileUrl = (<FileReader>event.target).result;
}
この場合、代わりにreader.result
を使用することもできます
今日、これはTypeScript 2.1.1で私のために働いた
interface EventTarget { result: any; }
targetオブジェクトには以下のようにアクセスして、修正するまでエラーを防ぐことができます。
reader= new FileReader();
reader.onload = function (imgsrc){
var fileUrl = imgsrc.target["result"];
}
ターゲットをJavascriptオブジェクトとして扱う
の代わりに
this.localDbRequest.onsuccess = function (event) {
const db = event.target.result;
};
行う
this.localDbRequest.onsuccess = function (event) {
const db = this.result;
};
これはjavascript/TypeScriptの重大な変更です。
あなたがする必要があるのは、単に「event.target.result」を「this.result」に置き換えることです。
ここでの「this」は、インターフェイス「MSBaseReader」のコンテキストを指します。
以下は私の実装の抜粋です:
let reader = new FileReader();
let profile: TransProfile = new TransProfile();
reader.onload = function(event){
profile.avatar = new Uint8Array(this.result);
}
reader.onerror = function(event){
}
this.photoLib.getPhoto(item)
.then(blob => reader.readAsArrayBuffer(blob))
.then(() => this.doUpload(profile));
「MSBaseReader」インターフェイス定義:
interface MSBaseReader {
onabort: (this: MSBaseReader, ev: Event) => any;
onerror: (this: MSBaseReader, ev: ErrorEvent) => any;
onload: (this: MSBaseReader, ev: Event) => any;
onloadend: (this: MSBaseReader, ev: ProgressEvent) => any;
onloadstart: (this: MSBaseReader, ev: Event) => any;
onprogress: (this: MSBaseReader, ev: ProgressEvent) => any;
readonly readyState: number;
readonly result: any;
abort(): void;
readonly DONE: number;
readonly EMPTY: number;
readonly LOADING: number;
addEventListener<K extends keyof MSBaseReaderEventMap>(type: K, listener: (this: MSBaseReader, ev: MSBaseReaderEventMap[K]) => any, useCapture?: boolean): void;
addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void;
}
「FileReader」インターフェース定義
interface FileReader extends EventTarget, MSBaseReader {
readonly error: DOMError;
readAsArrayBuffer(blob: Blob): void;
readAsBinaryString(blob: Blob): void;
readAsDataURL(blob: Blob): void;
readAsText(blob: Blob, encoding?: string): void;
addEventListener<K extends keyof MSBaseReaderEventMap>(type: K, listener: (this: FileReader, ev: MSBaseReaderEventMap[K]) => any, useCapture?: boolean): void;
addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void;
}
また、「onload()」内の「this」のコンテキスト変更により、「reader.onload = function(event){...」内でクラスベースの定義にアクセスできないことにも注意してください。つまり、「this.class-property」スタイルを使用してクラスプロパティを指定することはできません。
ローカル変数を定義する必要があります。上記の抜粋の「プロファイル」の定義と使用法を参照してください。