Arrays 如何将RestApi对象数据转换为数组？

如何将此数据从PokeApi转换为数组？我不能在html中用Angular调用它，因为我不能将它分配给数组。它给出了一个错误，因为它返回的是Object

 getPokemonDetail(index) {
    return this.http.get(`${this.baseURL}/pokemon/${index}`).pipe(
      map((poke) => {
        let sprites = Object.keys(poke['sprites']);
        poke['images'] = sprites
          .map((spriteKey) => poke['sprites'][spriteKey])
          .filter((img) => img);
        return poke;
      })
    );
  }

我在github上上传了代码，有人能检查错误在哪里吗？ 不幸的是，我没有成功：（

---

解决方案1

从Angular 6开始，现在有了一个keyvalue管道操作符

*ngFor="for item in objectList | keyvalue"

解决方案2

若要将对象转换为数组，只需将该对象放在[]内。假设对象位于图像变量中，则

Let imageArray = [this.image]

更新api调用函数，并在subsvribe内部将此响应转换为数组对象

getPokemonDetail(index) { return this.http.get(`${this.baseURL}/pokemon/${index}`) }

    

---

解决方案1

从Angular 6开始，现在有了一个keyvalue管道操作符

*ngFor="for item in objectList | keyvalue"

解决方案2

若要将对象转换为数组，只需将该对象放在[]内。假设对象位于图像变量中，则

Let imageArray = [this.image]

更新api调用函数，并在subsvribe内部将此响应转换为数组对象

getPokemonDetail(index) { return this.http.get(`${this.baseURL}/pokemon/${index}`) }

    

多谢各位 我两次都试过了，错误消失了，但我无法获得数据

   getPokemonDetail(index) {
    return this.http.get(`${this.baseURL}/pokemon/${index}`).pipe(
      map((poke) => {
        let sprites = Object.keys(poke['sprites']);
        poke['images'] = sprites
          .map((spriteKey) => poke['sprites'][spriteKey])
          .filter((img) => img);
        return [poke];
      })
    );
  }

在html中

<div class="titleC" *ngFor="let name of details.name | keyvalue">
          <h1>{{ name | uppercase }}</h1>
</div>

{{name |大写}}

谢谢 我两次都试过了，错误消失了，但我无法获得数据

   getPokemonDetail(index) {
    return this.http.get(`${this.baseURL}/pokemon/${index}`).pipe(
      map((poke) => {
        let sprites = Object.keys(poke['sprites']);
        poke['images'] = sprites
          .map((spriteKey) => poke['sprites'][spriteKey])
          .filter((img) => img);
        return [poke];
      })
    );
  }

在html中

<div class="titleC" *ngFor="let name of details.name | keyvalue">
          <h1>{{ name | uppercase }}</h1>
</div>

{{name |大写}}

我现在添加的键值是数组按钮的对象。 我还是没有得到数据

   getPokemonDetail(index) {
    return this.http.get(`${this.baseURL}/pokemon/${index}`).pipe(
      map((poke) => {
        let sprites = Object.keys(poke['sprites']);
        poke['images'] = sprites
          .map((spriteKey) => poke['sprites'][spriteKey])
          .filter((img) => img);
        return [poke];
      })
    );
  }

---

我现在添加的键值是数组按钮的对象。 我还是没有得到数据

   getPokemonDetail(index) {
    return this.http.get(`${this.baseURL}/pokemon/${index}`).pipe(
      map((poke) => {
        let sprites = Object.keys(poke['sprites']);
        poke['images'] = sprites
          .map((spriteKey) => poke['sprites'][spriteKey])
          .filter((img) => img);
        return [poke];
      })
    );
  }

---

谢谢，我尝试了这两种方法，错误消失了，但我无法获取数据。getPokemonDetail（index）{返回this.http.get（

${this.baseURL}/pokemon/${index}

）.pipe（map（（poke）=>{let sprites=Object.keys（poke['sprites']）；poke['images]=sprites.map（（spriteKey）=>poke['sprites'][spriteKey]）.filter（（img）=>img）；return[poke]；}）你能分享api的响应吗？在这个链接中，你能看到它吗：谢谢你，我两个都试过了，错误消失了，但我无法获得数据。getPokemonDetail（index）{返回this.http.get（

${this.baseURL}/pokemon/${index}

）.pipe（map(（poke）=>{let sprites=Object.keys（poke['sprites']）；poke['images']=sprites.map（（spriteKey）=>poke['sprites'][spriteKey]）.filter（（img）=>img）；return[poke]；}）；}你能分享api的响应吗？在这个链接中你能看到吗：你从[poke]中得到了什么？你告诉我是否插入了[]然后它转换为arrayYes。但是检查它是否具有预期的值。{value.name | uppercase}您不需要两者。您可以选择tenplate解决方案或ts解决方案。您在[poke]中得到什么？您告诉我，如果插入[]，它将转换为arrayYes。但是检查它是否具有预期的值。{value.name | uppercase}您不需要两者都需要。您可以选择tenplate解决方案或ts解决方案