Question

更新：抱歉，我复制了错误版本的代码：我现在在服务中调用了then，如图所示。

我正在创建一个提供模拟数据的服务（遵循与here类似的结构）但由于某种原因无法获取数据。

来自AppComponent的

片段

export class AppComponent implements OnInit{
  ngOnInit(){
    this.getData();
  }


  constructor(private _dataService: DataService){ }

  getData(){
      console.log('get data called');
      var data = this._dataService.getData();
      console.log('data type is '+typeof(data));
      console.log('data key is ');
      for(var k in data){
        console.log(k);
      }

DataService如下：

import {Injectable} from 'angular2/core';
import {MOCK_DATA} from './mock-data';

@Injectable()
export class DataService{
  getData(){
    return Promise.resolve(MOCK_DATA).then(data => data);
  }
}

模拟数据是：

export var MOCK_DATA = {
  "apple": [
    {"taste": "apple", "really": false},
    {"taste": "random", "really": true},
  ],
  "orange": [
    {"taste": "orange", "really": false},
    {"taste": "random", "really": true},
  ],
}

但是console.log结果是：

get data called
app.component.ts:46 data type object
app.component.ts:47 data key 
app.component.ts:49 __zone_symbol__state
app.component.ts:49 __zone_symbol__value
app.component.ts:49 then
app.component.ts:49 catch

Answer 1

您需要通过then方法调用返回的承诺上的getData方法才能接收数据：

getData() {
  console.log('get data called');
  this._dataService.getData().then(data => {
    // Handle the data

    // For example
    console.log('data type is '+typeof(data));
    console.log('data key is ');
    for(var k in data){
      console.log(k);
    }
  });
}

then方法必须在组件中使用，而不是在服务中使用。

您的服务应该是：

@Injectable()
export class RBACService{
  getData(){
    return Promise.resolve(MOCK_DATA);
  }
}

而不是

@Injectable()
export class RBACService{
  getData(){
    return Promise.resolve(MOCK_DATA).then(data => data);
  }
}

Answer 2

我认为你在AppComponent的装饰器中缺少代码的一些重要部分，如下所示：

import { Component, OnInit } from 'angular2/core';
import { RBACService } from './(serviceName).service';

@Component({
    selector: 'my-app',
    template: `whatever...`,
    providers: [RBACService]
})
export class AppComponent implements OnInit {

其中(serviceName)应该是您的inyectable服务的文件名，而因为DataService而在构造函数中将其视为，并且它实际上被称为RBACService {1}} ...

Angular2无法从Service获取模拟数据

2 个答案: