Ionic2无法调用角度服务

时间:2016-02-26 06:43:17

标签: angularjs ionic-framework ionic2

我有这个页面tag-navigation-p1.js

import {Modal, NavController, Page, Events, Platform, NavController, NavParams, ViewController} from 'ionic-framework/ionic';
import {TagNavigationPage2} from '/home/manish/Softwares/cordova/mobapp/app/pages/tag-navigations/tag-navigation-p2';
import {TagNavigationService} from '/home/manish/Softwares/cordova/mobapp/app/pages/tag-navigations/tag.navigation.service';

@Page({
  templateUrl: 'build/pages/tag-navigations/tag-navigation-p1.html',

})
export class TagNavigationPage1 {
  constructor(
      platform: Platform,
      params: NavParams,
      viewCtrl: ViewController,
      public nav: NavController
  ) {


  }

  dismiss() {
    this.viewCtrl.dismiss();
  }

  nextPage() {
    debugger
    TagNavigationService.getHeroes()
                         .subscribe(
                           error =>  this.errorMessage = <any>error);    
    this.nav.push(TagNavigationPage2);
  }
}

这里是tag.navigation.service.js

import {Injectable}     from 'angular2/core';
import {Http, Response} from 'angular2/http';
import {Headers, RequestOptions} from 'angular2/http';
import {Observable}     from 'rxjs/Observable';

@Injectable()
export class TagNavigationService {
  constructor (private http: Http) {}

  private _heroesUrl = 'app/heroes';  // URL to web api

  getHeroes () {
    console.log("get heros called");
    return this.http.get(this._heroesUrl)
                    .do(data => console.log(data))
                    .catch(this.handleError);
  }

  private handleError (error: Response) {
    console.log("get heros error called");
    console.error(error);
    return Observable.throw(error.json().error || 'Server error');
  }
}

当我从getHeros()拨打nextPage()时,我收到此错误:

Uncaught EXCEPTION: Error during evaluation of "click"
ORIGINAL EXCEPTION: TypeError: tag_navigation_service_1.TagNavigationService.getHeroes is not a function
ORIGINAL STACKTRACE:
TypeError: tag_navigation_service_1.TagNavigationService.getHeroes is not a function
    at TagNavigationPage1.nextPage (file:///android_asset/www/build/js/app.bundle.js:62368:56)
    at AbstractChangeDetector.ChangeDetector_TagNavigationPage1_0.handleEventInternal (viewFactory_TagNavigationPage1:47:33)
    at AbstractChangeDetector.handleEvent (file:///android_asset/www/build/js/app.bundle.js:14048:30)
    at AppView.triggerEventHandlers (file:///android_asset/www/build/js/app.bundle.js:18355:37)
    at eval (viewFactory_TagNavigationPage1:287:124)
    at file:///android_asset/www/build/js/app.bundle.js:33426:37
    at file:///android_asset/www/build/js/app.bundle.js:32803:87
    at Zone.run (file:///android_asset/www/build/js/app.bundle.js:2258:25)
    at Zone.run (file:///android_asset/www/build/js/app.bundle.js:17599:43)
    at NgZone.run (file:///android_asset/www/build/js/app.bundle.js:17547:41)
ERROR CONTEXT:
[object Object]

我正在关注此http://plnkr.co/edit/y28jDxbuxCyLLH0rFjj2?p=options

1 个答案:

答案 0 :(得分:0)

正如@Pardeep Jain所说,你需要在构造函数中注入你的服务。请尝试以下步骤以避免未定义的错误。

export class TagNavigationPage1 {

   TagNavigationService;

  constructor(
      platform: Platform,
      params: NavParams,
      viewCtrl: ViewController,
      public nav: NavController,
      tagNavigation: TagNavigationService
  ) {
     this.TagNavigationService = tagNavigation;

  }

  dismiss() {
    this.viewCtrl.dismiss();
  }

  nextPage() {
    debugger;
    this.TagNavigationService.getHeroes()
                         .subscribe(
                           error =>  this.errorMessage = <any>error);    
    this.nav.push(TagNavigationPage2);
  }
}