Question

我有一个json文件，我正在尝试使用Angular 2中的服务将此信息放入我的项目中。这是我的代码：

这是我的服务：

import { Injectable } from '@angular/core';
import { Http, Response} from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class RecordsService {

data: any;

  constructor(private http: Http) { }

  getRecords(id) {
 return this.http.get('../assets/data/03_data.json')
      .map(data => {
        this.data = data;
      }, err => {
        if (err) {
          return err.json();
        }
      });
  }

}

这是组件：

import { Component, OnInit } from '@angular/core';
import { RecordsService } from '../shared/services/records.service';

@Component({
  selector: 'app-content',
  templateUrl: './content.component.html',
  styleUrls: ['./content.component.css'],
  providers: [RecordsService]
})
export class ContentComponent implements OnInit {

  constructor(private recService: RecordsService) { }

  ngOnInit() {
  }

  getRecords(id) {
    this.recService.getRecords(id)
      .subscribe(data => {
      console.log(data);
      }, err => {
        console.log(err);
      });
  }

}

有人可以帮助我做错了吗。谢谢！

Answer 1

你没有在任何地方调用getRecords()所以根本不会被解雇。我们发现id根本不应该是getRecords()中的参数。所以请调用OnInit中的方法：

ngOnInit() {
   this.getRecords();
}

你还需要从响应中返回实际的json，即.json()，所以：

.map(data => {
   this.data = data.json();
   return data.json();
}

Answer 2

您需要从map声明中返回一些内容：

.map(data => {
        this.data = data;
        return data;
      }

从Angular 2中的json文件中获取数据

2 个答案: