web-dev-qa-db-ja.com

Angular 2 bootstrap関数は「引数型AppComponentはパラメータ型Typeに割り当てられません」というエラーが発生します」

これが私の最初のシンプルな_Hello World_ angular 2アプリ Angular 2クイックスタートガイド からです。

_import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
@Component({
    selector: 'ng2-app',
    template: '<h1>My first Angular 2 App</h1>'
})
export class AppComponent { }


bootstrap(AppComponent);
_

_npm start_で実行するとアプリケーションは正常に動作しますが、IntelliJ IDEはbootstrap(AppComponent)の行にエラーを表示しています

引数タイプAppComponentはパラメータータイプTypeに割り当てられません

Angular 2 TypeScript warning

bootstrap関数宣言を見ると、AppComponentTypeを拡張する必要があります。

_export declare function bootstrap(appComponentType: Type, customProviders?: Array<any>): Promise<ComponentRef>;
_

私の質問は:

AngularコンポーネントがTypeを拡張することが期待されていますか?

44
TheKojuEffect

実際、AppComponentはTypeを拡張することが期待されています。以下を使用してください:

// app.component.ts
import { Component, Type } from '@angular2/core';

@Component({
...
...
})
export class AppComponent extends Type {}

これは、AppComponent(ブートストラップされる)のng2によって予想される規則にも従います。

extends部分がなくても実行されるため、ng2チュートリアルでなぜそれらをカバーしなかったのかはわかりません。

これはWebStorm/IntelliJで完璧に機能します。

編集:別の解決策は、Webstorm v2016.2(このコメントの時点で安定している)に更新することです。

10
jsNovice

私はIntellij 2016.1.2でAngular=クイックスタートデモを使用して、つまずきました。IDE=で次のオプションを設定すると役に立ちました。

enter image description here

52
JockX

以下に示すようなコメント/注釈を追加すると、問題が解決します

//noinspection TypeScriptValidateTypes
bootstrap(AppComponent);
14
Otari

上記の答えは私にはうまくいきませんでした。上記のコメントで推奨されていることを実行することで修正できました。

bootstrap(<any>AppComponent);

Intellij 14.1.5を使用しています

11
Kris Hollenbeck

TypeScriptコンパイラによるこのエラーの導入は、IDEで有効になっていません。 TypeScriptコンパイラを有効にする必要があります。

WebstormでTypeScriptコンパイラを有効にします。

webstormメニュー(左上のメニュー)=>環境設定メニュー=>言語とフレームワーク=> TypeScriptをクリック=> TypeScriptコンパイラーを有効化(チェックボックスを有効化)=>有効化tsconfig.jsonオプションを使用=> Okボタンで完了です。

enter image description here

1
Mukund Kumar

Webstorm 2016.1.3上記のソリューションは私のために働く

設定->言語とフレームワーク-> TypeScript:TypeScriptを有効にし、tsconfig.jsonを使用

PS:これは、以前のWebstormバージョン(2016.1.3)で説明したものと同じソリューションです

1
Pumych

WebStorm/IntelliJが文句を言わないようにコードを全面的に変更するIMOは実行可能なソリューションではありません。別のバンドル/コンパイルプロセスがあるので、代わりにTypeScriptでIntelliJのopsを無効にしました:Settings-> Languages-> TypeScript-そこでオプションをオフにします。それがすでにあなたに当てはまる場合は、オプションをチェックし、適用してから再びチェックを外してみてください。

これはまだ少しバグがあることがわかります。たとえば、IDE(SHIFT + F6))を使用してクラスの名前を変更した後、エラーが返されました。上記を繰り返すと再びエラーが削除されました。

IntelliJ 15.0.2を使用する

1
Erez Cohen

新しいangular2ルーターの場合、..

bootstrap(AppComponent [
    <any>APP_ROUTER_PROVIDERS
    ]).catch((err:any) => console.error(err));

注意anyは、AppComponentではなくAPP_ROUTER_PROVIDERSで使用されます。

0
danday74