离子2 - 服务意外标记错误 [英] Ionic 2 - Services unexpected token error

问题描述

我想在离子2应用使用注射在我的code和我得到这个错误。

I am trying to use an Injectable in my code in an Ionic 2 app and I get this error.

模块构建失败：语法错误：/home.js：意外的令牌（10:25）

Module build failed: SyntaxError: /home.js: Unexpected token (10:25)

export class HomePage {
constructor(myservice: WpService) {
                     ^
         this.service = myservice;
        this.data = null;
     }

这是我的code：（home.js文件）

This is my code: (home.js file).

import {Page} from 'ionic-framework/ionic';
import {WpService} from './wpservice';

@Page({
  templateUrl: 'build/pages/home/home.html',
    providers: [WpService]
})
export class HomePage {
    constructor(myservice: WpService) {
        this.service = myservice;
        this.data = null;
    }

    retrieve() {
        this.service.loadData();
        setTimeout(() => {
            this.data = this.service.getData();
            console.log(this.data);
        }, 5000);
    }
}

这就是wpservice文件：

and this is the wpservice file:

import {Injectable} from 'angular2/core';
import {Http} from 'angular2/http';
import 'rxjs/Rx'

@Injectable
export class WpService {
    constructor(http: Http) {
        this.http = http;
        this.data = null;
    }

    loadData() {
        this.http.get('<some rest api>').subscribe(data => {
            this.data = data.json() 
        });
        }

    getData() {
        return this.data;
    }
    }

奇怪的是这个错误只从2月26日晚上发生的。在此之前，它是工作的罚款。

Strangely this error is occurring only from feb 26 evening. Before that it was working fine.

推荐答案

谢谢你们，我解决了这个问题。我会后我做到了下面这样其他人面临同样会得到好处。

Thanks guys, I resolved this issue. I'll post how I did it below so that anyone else facing the same would get benefited.

我写了一个GET参数（）方法，如下图所示。 （在看看从轻松进行漂移合作团队在GitHub上的离子会议应用后）。

I wrote a get parameters() method as shown below. (After having a look at the ionic conferencing app from the drifty co team on github).

import {Page} from 'ionic-framework/ionic';
import {Inject} from 'angular2/core;
import {WpService} from './wpservice';

@Page({
  templateUrl: 'build/pages/home/home.html',
    providers: [WpService]
})
export class HomePage {
    static get parameters(){
       return [WpService];
      }
    constructor(wpservice) {
        this.service = wpservice;
        this.data = null;
    }

    retrieve() {
        this.service.loadData();
        setTimeout(() => {
            this.data = this.service.getData();
            console.log(this.data);
        }, 5000);
    }
}

和我改变如下服务文件：

And I changed the service file as below:

import {Injectable, Inject} from 'angular2/core';
import {Http} from 'angular2/http';
import 'rxjs/Rx'

@Injectable()
export class WpService {
    static get parameters(){
      return [Http];
      }
    constructor(http) {
        this.http = http;
        this.data = null;
    }

    loadData() {
        this.http.get('<some rest api>').subscribe(data => {
            this.data = data.json() 
        });
        }

    getData() {
        return this.data;
    }
    }

柜面你决定要注入多个服务，那么你需要给在get参数的方法如下面的return语句：

Incase you decide to inject more than one service then you need to give the return statement in the get parameters method like below:

return [[service1],[service2]];

希望这有助于其他人面临着同样的问题。谢谢你。

Hope this helps someone else facing the same issue. Thanks.

这篇关于离子2 - 服务意外标记错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！