Подтвердить что ты не робот

Angular 2 функция начальной загрузки дает ошибку "Тип аргумента AppComponent не присваивается типу параметра Тип"

Вот мое первое простое приложение 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 не присваивается типу параметра Тип

Angular 2  typescript warning

Глядя на объявление функции bootstrap, AppComponent нужно расширять Type.

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

Мой вопрос:

Ожидается ли для компонентов angular расширение Type?

4b9b3361

Ответ 1

Фактически, ожидается, что AppComponent расширит тип. Поэтому используйте следующее:

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

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

Это также будет следовать ожидаемому соглашению ng2 для AppComponent (для загрузки).

Я не уверен, почему они не покрывали его в учебниках ng2, возможно, они могут быть нацелены на упрощение начального обучения, поскольку он работает даже без части extends.

Это отлично работает в WebStorm/IntelliJ.

Изменить: Альтернативное решение - обновить до Webstorm v2016.2 (который является стабильным во время этого комментария).

Ответ 2

Я наткнулся на это в Intellij 2016.1.2, с демонстрацией Angular quickstart. Настройка следующих параметров в среде IDE помогла:

введите описание изображения здесь

Ответ 3

Добавление комментария/аннотации, как показано ниже, решает проблему

//noinspection TypeScriptValidateTypes
bootstrap(AppComponent);

Ответ 4

Этот ответ мне не помог. Я смог исправить это, выполнив то, что было рекомендовано в комментариях выше.

bootstrap(<any>AppComponent);

Я использую Intellij 14.1.5

Ответ 5

IMO меняет код во всем, так что WebStorm/IntelliJ не будет жаловаться, не является жизнеспособным решением. Поскольку у меня есть отдельный процесс компоновки/компиляции, я вместо этого отключил IntelliJ ops на typescript: Настройки- > Языки → Typescript - снимите флажки с опций. Если это уже относится к вам, вы можете попробовать проверить параметры, применив, а затем снова снимите флажок.

Вы можете видеть, что это все еще немного неправильно. Например, после того, как я сделал переименование классов с помощью IDE (SHIFT + F6), возвращаемые ошибки. Повторение приведенного выше удаляет их снова.

Использование IntelliJ 15.0.2

Ответ 6

Webstorm 2016.1.3 решение выше работает для меня

Настройки → Язык и рамки → TypeScript: Включить TypeScript, Используйте tsconfig.json

PS: Это то же самое решение, что описано ранее для предыдущей версии Webstorm (2016.1.3)

Ответ 7

Эта ошибка, возникающая из-за компилятора TypeScript, не включена в вашей среде IDE. вам нужно включить компилятор TypeScript.

Включить компилятор TypeScript в Webstorm:

перейдите в меню Webstorm (в верхнем левом меню) = > Меню настроек = > Языки и рамки = > щелкните по TypeScript = > Включить компилятор TypeScript (включить флажок) = > включить Использовать параметр tsconfig.json = > нажать кнопку "ОК", и все готово.

введите описание изображения здесь

Ответ 8

Для нового маршрутизатора angular2 мне пришлось делать.

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

ПРИМЕЧАНИЕ. Любое используется для APP_ROUTER_PROVIDERS, а не для AppComponent.

Ответ 9

//noinspection TypeScriptValidateTypes Работала для меня в WebStorm.

Также я открыл свой проект в IntelIJ вместо этого, и ошибки не было.