我是否错误地注入了这个 Angular2 服务? (离子2项目)
Am I injecting this Angular2 service incorrectly? (Ionic2 project)
我有以下服务:
import { Injectable } from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class MovieService {
static get parameters() {
return [[Http]];
}
constructor(private http:Http) {
}
searchMovies(movieName) {
var url = 'http://api.themoviedb.org/3/search/movie?query=&query=' + encodeURI(movieName) + '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';
var response = this.http.get(url).map(res => res.json());
return response;
}
}
(我实际上不确定获取参数函数的目的是什么,因为我从一个例子中得到它,但它的存在似乎不会引起任何问题)
我正在尝试将服务注入组件:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {MovieService} from '../../services/psa-web-api.service';
@Component({
templateUrl: 'build/pages/browsed/browsed.html',
providers:[MovieService]
})
export class BrowsedPage {
constructor(private movieService: MovieService, public navCtrl: NavController) {
}
}
但每次我提供应用程序并通过浏览器访问它时,它都会弹出以下控制台错误:
EXCEPTION: Error: Uncaught (in promise):
EXCEPTION: Error in ./MyApp class MyApp_Host - inline template:0:0
ORIGINAL EXCEPTION: No provider for ConnectionBackend! ORIGINAL STACKTRACE: Error: DI Exception
除了这个post,我在网上找不到很多关于这个错误的东西,它不是很有帮助:https://groups.google.com/forum/#!topic/angular/z7jnb6goZUQ
编辑:为进一步的上下文添加这个,我的 app.ts 文件:
import { Component} from '@angular/core';
import { Platform, ionicBootstrap } from 'ionic-angular';
import {HTTP_PROVIDERS } from '@angular/http';
@Component({
template: '<ion-nav [root]="rootPage"></ion-nav>',
providers: []
})
export class MyApp {...}
ionicBootstrap(MyApp, [HTTP_PROVIDERS]);
我不知道 Ionic 所以我可能是错的但是在 Angular2 中需要 HttpModule 才能处理 http。 (RC5及以后版本)
import { HttpModule} from '@angular/http';
@NgModule({
imports: [
BrowserModule,
HttpModule, //<------HttpModule is required to import
],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
RC4
import {HTTP_PROVIDERS} from '@angular/http';
bootstrap(AppComponent, [
HTTP_PROVIDERS, //<-----need to inject here
....
])
尝试不使用 get parameters
方法,因为它不再需要(我认为它在以前版本的 Ionic2 中使用过,所以你得到的示例可能没有更新)
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class MovieService {
constructor(private http:Http) {
}
searchMovies(movieName) {
var url = 'http://api.themoviedb.org/3/search/movie?query=&query=' + encodeURI(movieName) + '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';
var response = this.http.get(url).map(res => res.json());
return response;
}
}
也尝试不导入 HTTP_PROVIDERS
import { HTTP_PROVIDERS } from '@angular/http';
所以你的 ionicBootstrap
看起来像这样:
ionicBootstrap(MyApp);
我的app.ts
看起来像这样
import {HTTP_PROVIDERS} from '@angular/http';
@Component({
templateUrl: "build/app.html",
providers: [HTTP_PROVIDERS]
})
然后是
ionicBootstrap(MyApp) //without the HTTP_PROVIDERS
我有以下服务:
import { Injectable } from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class MovieService {
static get parameters() {
return [[Http]];
}
constructor(private http:Http) {
}
searchMovies(movieName) {
var url = 'http://api.themoviedb.org/3/search/movie?query=&query=' + encodeURI(movieName) + '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';
var response = this.http.get(url).map(res => res.json());
return response;
}
}
(我实际上不确定获取参数函数的目的是什么,因为我从一个例子中得到它,但它的存在似乎不会引起任何问题)
我正在尝试将服务注入组件:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {MovieService} from '../../services/psa-web-api.service';
@Component({
templateUrl: 'build/pages/browsed/browsed.html',
providers:[MovieService]
})
export class BrowsedPage {
constructor(private movieService: MovieService, public navCtrl: NavController) {
}
}
但每次我提供应用程序并通过浏览器访问它时,它都会弹出以下控制台错误:
EXCEPTION: Error: Uncaught (in promise):
EXCEPTION: Error in ./MyApp class MyApp_Host - inline template:0:0
ORIGINAL EXCEPTION: No provider for ConnectionBackend! ORIGINAL STACKTRACE: Error: DI Exception
除了这个post,我在网上找不到很多关于这个错误的东西,它不是很有帮助:https://groups.google.com/forum/#!topic/angular/z7jnb6goZUQ
编辑:为进一步的上下文添加这个,我的 app.ts 文件:
import { Component} from '@angular/core';
import { Platform, ionicBootstrap } from 'ionic-angular';
import {HTTP_PROVIDERS } from '@angular/http';
@Component({
template: '<ion-nav [root]="rootPage"></ion-nav>',
providers: []
})
export class MyApp {...}
ionicBootstrap(MyApp, [HTTP_PROVIDERS]);
我不知道 Ionic 所以我可能是错的但是在 Angular2 中需要 HttpModule 才能处理 http。 (RC5及以后版本)
import { HttpModule} from '@angular/http';
@NgModule({
imports: [
BrowserModule,
HttpModule, //<------HttpModule is required to import
],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
RC4
import {HTTP_PROVIDERS} from '@angular/http';
bootstrap(AppComponent, [
HTTP_PROVIDERS, //<-----need to inject here
....
])
尝试不使用 get parameters
方法,因为它不再需要(我认为它在以前版本的 Ionic2 中使用过,所以你得到的示例可能没有更新)
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class MovieService {
constructor(private http:Http) {
}
searchMovies(movieName) {
var url = 'http://api.themoviedb.org/3/search/movie?query=&query=' + encodeURI(movieName) + '&api_key=5fbddf6b517048e25bc3ac1bbeafb919';
var response = this.http.get(url).map(res => res.json());
return response;
}
}
也尝试不导入 HTTP_PROVIDERS
import { HTTP_PROVIDERS } from '@angular/http';
所以你的 ionicBootstrap
看起来像这样:
ionicBootstrap(MyApp);
我的app.ts
看起来像这样
import {HTTP_PROVIDERS} from '@angular/http';
@Component({
templateUrl: "build/app.html",
providers: [HTTP_PROVIDERS]
})
然后是
ionicBootstrap(MyApp) //without the HTTP_PROVIDERS