Question

我可能只停留在一些基本的东西上，但我只是不能把头缠在上面。

我有一项将数据传递到组件data.service.ts

的服务

  export class DataService {

  constructor(private http: HttpClient) { }

  getTrailers() {
    return this.http.get('./assets/trailers.json')
  }

  getUsers() {
    return this.http.get('https://jsonplaceholder.typicode.com/users/')
  }


  getUser(userId) {
    return this.http.get('https://jsonplaceholder.typicode.com/users/' + userId)
  }


  getTrailer(trailerID) {
    return this.http.get('./assets/trailers.json/' + trailerID)
  }
}

但是我在使用getTrailer方法发送正确的数据时遇到了问题。因为显然我最新的“尝试”方法会尝试查找不存在的trailers.json/1。

我目前唯一可行的想法是使用蛮力模仿

的结构

https://jsonplaceholder.typicode.com/users

通过制作大量的trailersX.json文件

我也尝试过控制台日志记录

getTrailers() {
    return this.http.get('./assets/trailers.json')
  }

看看我是否可以使用它，但是得到的只是一个未定义的对象。

Answer 1

您可以使用rxjs映射运算符执行类似的操作

getTrailer(trailerID) {
  return this.http.get('./assets/trailers.json')
    .pipe(map(trailers => {

       return trailers.filter(t => t.id === trailerID)
    }));
}

如果您使用的是角度5，请在下面使用

getTrailer(trailerID) {
  return this.http.get('./assets/trailers.json')
    map(trailers => {

       return trailers.filter(t => t.id === trailerID)
    });
}

查看此有效的stackblitz

从JSON文件传递单个对象

1 个答案: