如何修复Angular 2`Uncaught(在promise中):TypeError:无法读取null`的属性'query'？

Question

我一直在使用Angular 2文档中的Heroes教程进行实验.但是,我已经明白我不明白这个错误发生了什么:

Uncaught (in promise): TypeError: Cannot read property 'query' of null在browser_adapter.ts:88.

涉及的两件是HeroDetailComponent和HeroService.

import { Component, OnInit } from '@angular/core'; 
import { RouteParams } from '@angular/router-deprecated';

import { Hero, HeroService } from '../index';

@Component({
    selector: 'my-hero-detail',
    templateUrl: ...
    styleUrls: [...]
})
export class HeroDetailComponent implements OnInit {

    hero: Hero;

    // TEMPORARY FIX:
    _heroService = new HeroService();  // Avoids injection

    // constructor(private _heroService: HeroService,
    //             private _routeParams: RouteParams) {}

    constructor(private _routeParams: RouteParams) {}

    ngOnInit() {
        let id = +this._routeParams.get('id');
        console.log(id);
    }
}

当我使用这个代码时,它的工作原理.但是当我切换构造函数并使用带HeroService注入的构造函数时,我得到了前面提到的错误.

@Injectable()
export class HeroService {

    getHeroes() {
        return HEROES;
    }

    getHero(id: number) {
        return new Hero(1, 'Name', 'Power', 'AlterEgo');
    }
}

当我试图弄清楚发生了什么时,我删除了所有与promise相关的代码.但是,我仍然得到同样的错误.一切都很好编译,这是一个运行时错误.的HeroService和RouteParams在父组件提供.

两个问题:

1. 如何解决这个问题？
2. 如何调试这类问题？

我倾向于认为这是Angular 2中的一个错误,但我不确定如何确保这不是我的错误.提前致谢.

更新:

1. 我已经添加了临时修复代码(这避免了注入,因此不能解决这个问题,因为我希望注射正常工作).

2. 这是一个Plunker,其中包含我正在尝试的代码的近似版本.我无法让它正常运行,但通过查看代码来诊断问题可能会有所帮助.

Answer 1

我看到以下问题:HeroComponent取决于HeroDetailsComponent,但后来在文件中HeroDetailsComponent导出.app/heroes/index.ts

有人报道了这样的设置有问题在这里