[英]Angular 2 - Http provider error
I'm just starting with Angular 2 and I'm trying to get a http request.我刚开始使用 Angular 2,我正在尝试获取 http 请求。
The code is as follows代码如下
import { Component, View, bootstrap } from 'angular2/angular2';
import { TodoInput } from './todoInput.ts';
import { TodoList } from './todoList.ts';
import { TodoService } from './todoService.ts';
import { HttpService } from './httpService.ts';
@Component({
selector: 'my-app'
})
@ View({
directives: [TodoInput, TodoList]
templateUrl: 'templates/app.html'
})
class AppComponent {
color: string;
numbr: number;
hidden: boolean;
constructor(public myservice: TodoService, public https: HttpService) {
this.color = 'blue';
this.numbr = 5;
this.hidden = false;
https.getHttpData();
}
}
bootstrap(AppComponent, [TodoService, HttpService]);
and the http service is as follows: http服务如下:
import { Http, HTTP_PROVIDERS } from 'angular2/http';
import {Injectable} from 'angular2/core'
@Injectable()
export class HttpService {
private url: string = 'http://www.omdbapi.com/?s=walking';
data: array[string] = [];
logError(error):void {
console.log(error);
}
constructor(public http: Http) {
}
public getHttpData() {
this.http.get(this.url)
.map(res => res.json())
.subscribe(
data => this.data = data,
err => this.logError(err),
() => console.log('Random Quote Complete')
);
}
}
When I ran the app, I get the following error: EXCEPTION: No provider for e! (AppComponent -> HttpService -> e)
当我运行该应用程序时,出现以下错误:
EXCEPTION: No provider for e! (AppComponent -> HttpService -> e)
EXCEPTION: No provider for e! (AppComponent -> HttpService -> e)
and angular2.dev.js:21835 Error: DI Exception
EXCEPTION: No provider for e! (AppComponent -> HttpService -> e)
和angular2.dev.js:21835 Error: DI Exception
Any ideas?有任何想法吗? What am I missing?
我错过了什么?
Thanks in advance for your help.在此先感谢您的帮助。
UPDATE I managed to make it work.更新我设法让它工作。 I hope it's correct, but it works:
我希望它是正确的,但它有效:
import { Component, View, NgFor, FORM_DIRECTIVES, bootstrap } from 'angular2/angular2';
import { TodoInput } from './todoInput.ts';
import { TodoList } from './todoList.ts';
import { TodoService } from './todoService.ts';
import { HttpService } from './httpService.ts';
import { HTTP_PROVIDERS } from 'angular2/http';
@Component({
selector: 'my-app'
})
@View({
directives: [TodoInput, TodoList, NgFor, FORM_DIRECTIVES]
templateUrl: 'templates/app.html'
})
class AppComponent {
color: string;
numbr: number;
hidden: boolean;
shows: [string] = [];
constructor(public myservice: TodoService, public https: HttpService) {
this.color = 'blue';
this.numbr = 5;
this.hidden = false;
}
searchShows():void {
this.https.getHttpData(this.keyword).subscribe(
data => this.shows = data.Search,
err => console.log(err),
() => console.log('done!')
);
}
}
bootstrap(AppComponent, [HTTP_PROVIDERS, TodoService, HttpService]);
And my service class:还有我的服务类:
import { Http } from 'angular2/http';
import { Inject } from 'angular2/core'
export class HttpService {
private url: string = 'http://www.omdbapi.com/?s=';
data: [string] = [];
logError(error):void {
console.log(error);
}
constructor(@Inject(Http) public http: Http) {
}
public getHttpData(keyword) {
return this.http.get(this.url + keyword)
.map(res => res.json());
}
}
I can't, however, make it work so that the service is the only class that uses all the http needed dependencies.但是,我无法让它工作,因此该服务是唯一使用所有 http 所需依赖项的类。 It seems like the main class has to bootstrap http_providers.
似乎主类必须引导 http_providers。 Not sure why.
不知道为什么。
I don't use Angular 2, but我不使用 Angular 2,但是
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.