2017-06-14 6 views
2

これは私に何度も起こったので、何か間違っているのか、Typescript/Angularが本当にやっていないのか聞いてみたい。私の理解から、最大の強みの1つは、変数、パラメータなどの型宣言(インタフェース)です。Typescript/Angular Type宣言は役に立ちませんか?

今日、私はこの問題を持っていた:

簡単なスイッチボタン:

<p-selectButton [options]="posLayouts" (onChange)="handle($event)" [(ngModel)]="pageSize"></p-selectButton> 

変数:

pageSize: number; 

    posLayouts: SelectItem[]; 

    //On mistake I setted the value here as a string 
    this.posLayouts.push({label:'1 Woche', value: '1'}); 
    this.posLayouts.push({label:'3 Wochen', value: '3'}); 

変更機能で、私は単に外の値を持つ別の関数を呼び出しますposLayouts。

handle(e){getPager(this.pageSize)} 
    getPager(pageSize: number = 3){ 
    let totalPages: number; 
    totalPages = 23 + pageSize -1 
    console.log(totalPages) 
} 

にconsole.log()、それが文字列としてのpageSizeをとる代わりに、所望の23または25のeiter 230又は232より戻ります。このタイプのエラーは見つけにくいですが、今回は私が見つけやすいのが幸運でした。 角度型またはtslint型または私のエディタでは、数値変数に文字列を格納できない場所を教えてくれません。

私の理解のために、typescriptは互換性をチェックするか、Angularは何とかここでリスニングを無効にする必要がありますか?または私は何か間違っているのですか?

答えて

1

TypeScriptタイプは、開発ツール(リンター、オートコンプリートなど)でのみ使用されます。
ランタイムでは、すべてのコードがJavaScriptに変換され、使用可能な型情報はありません。
コードの外部からのユーザー入力やその他のデータソースについては、データが期待するタイプに適合していることを確認する必要があります。

+0

私は聞きたかったものではありませんが、ありがとうございます。だから、ユーザー入力は自分自身でタイプチェックされている必要があります。 – Doomenik

+0

はい、タイプは開発用とビルドプロセス用です(より効率的なツリーシェーキング)。生成されたJSコードのどこにでも型チェックを続けると、パフォーマンスの影響が非常に大きくなります。 –

関連する問題