Chromeは "Can not GET /"をAngular 4 - Observableと言います

Question

私は観測可能なデータをサービスに追加しようとしました。そのアプリケーションが完璧に動作するまで。

マイサービス

import { Injectable } from '@angular/core'; 
import { Hero } from './hero'; 
import { HEROES } from './mock-heroes'; 
import { Observable } from 'rxjs/observable'; 
import { of } from 'rxjs/Observable/of'; 
import { MessageService } from './message.service'; 

@Injectable() 
export class HeroServiceService { 

    getHeroes(): Observable<Hero[]> { 
    this.messageService.add("Hero Service:fetched heroes"); 
    return of(HEROES); 
    } 

    constructor(public messageService: MessageService) { } 

} 

を次のようになり、私はサービスと呼ばれる方法：

getHeroes(): void { 
    this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes); 
    } 

Answer 1

は、私は私がそれらをインポート持つライブラリの位置を変更しました。 @ angular/coreの直後にインポートする必要があると思います。

import { Injectable } from '@angular/core'; 
import { Observable } from 'rxjs/Observable'; 
import { of } from 'rxjs/observable/of'; 

import { Hero } from './hero'; 
import { HEROES } from './mock-heroes'; 
import { MessageService } from './message.service'; 
import 'rxjs/add/observable/of'; 

@Injectable() 
export class HeroServiceService { 

    getHeroes(): Observable<Hero[]> { 
    this.messageService.add("Hero Service:fetched heroes"); 
    return of(HEROES); 
    } 

    constructor(public messageService: MessageService) { } 

}