Как подключить Http в Angular 2 RC5?

Question

[Егор Желудков]

Коллеги! Помогите подключить HttpModule в Angular 2 Release Candidate 5.
Который день бьюсь над задачей, вседа вылетает одна и та же ошибка.
SystemJS: Expected expression, got '<'
До тех пор, пока не подключался Http, Angular 2 работал корректно. Даже заново пакеты загружал. Читал, что это может быть неверное подключение библиотек, но VisualStudio Code, который следит за такими вещами, ошибок не выдал. В чем трабл? Очень нужна помощь, товарищи!

Файл app.component.ts импорт
import {Component, Injectable} from '@angular/core';
import { TodoListComponent } from './todo/todo-list.component';
import { Todo } from './todo/todo';
import { TodoItem } from './todo/todo-item.component'
import { TodoFormComponent } from './todo/todo-form.component'
import { Http, HttpModule, Response } from '@angular/http';

@Component({
selector: 'todo-app',
templateUrl: `./app/app.component.html`,
styleUrls: ['./app/app.component.css'],
directives: [TodoListComponent,TodoFormComponent, TodoItem]
})

Comments

[Егор Желудков]

Файл app.module.ts

import {HttpModule} from '@angular/http';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { Http, Response } from '@angular/http';

@NgModule({
imports: [ BrowserModule, HttpModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }

[Егор Желудков]

index.html


System.config({
transpiler: 'typescript',
typescriptOptions: {emitDecoratorMetadata: true},
map: {
'app' : 'app',
'rxjs': 'node_modules/rxjs',
'@angular' : 'node_modules/@angular'
},
packages: {
'app' : {main: 'main',
defaultExtension: 'ts'},
'rxjs' : {main: 'index.js'},
'@angular/core' : {main: 'index.js'},
'@angular/common' : {main: 'index.js'},
'@angular/compiler' : {main: 'index.js'},
'@angular/router' : {main: 'index.js'},
'@angular/platform-browser' : {main: 'index.js'},
'@angular/platform-browser-dynamic': {main: 'index.js'},
'@angular/http/bundles' : {main: 'http.umd.min.js'}
}
});

System.import('app').catch(function(err){ console.error(err); });

[Егор Желудков]

main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
import { Http, Response } from '@angular/http';
platformBrowserDynamic().bootstrapModule(AppModule);

[Руслан Лопатин]

Может быть так?

'@angular/http' : {main: 'bundles/http.umd.min.js'}

[Егор Желудков]

Руслан Лопатин: Спасибо, товарищ! Столько времени потратил в поисках истины... Http подключается теперь. Только никак не могу получить из .json объекты... отказывается работать... Понимаю, что снова дело, видать, в моих кривых ручках... Подскажешь?)

[Егор Желудков]

Руслан Лопатин: А, нет, с выводом поспешил. В консоль я могу вывести объект this.data, а добавить данные в шаблон не получается(((( не видит он этот массив... Т.е. нельзя обратиться {{ data.name }}, например.

Answer 1

[Егор Желудков]

'@angular/http' : {main: 'bundles/http.umd.min.js'}

Подсказал Руслан Лопатин @lorus. Почему так работает, я не понял. Но оно работает!