Javascript 将对象从RESTAPI推送到数组中

在我的Angular应用程序中，我调用了一个RESTAPI，它从iTunesAPI返回结果。我想做的是，能够有一个添加按钮，让我将对象（歌曲对象）添加到数组中，这样用户就可以创建自己的播放列表。如何将对象从RESTAPI推送到数组中？到目前为止，我对Component.ts的代码是：

import { Component, OnInit } from '@angular/core';
import { ApiService } from '../../../services/api.service';
import { FormGroup, FormControl } from '@angular/forms';
import { FormBuilder } from '@angular/forms';
import { faSearch } from '@fortawesome/free-solid-svg-icons';
import { faRedo } from '@fortawesome/free-solid-svg-icons';
import { faHeadphones} from '@fortawesome/free-solid-svg-icons';
import { faExternalLinkAlt} from '@fortawesome/free-solid-svg-icons';

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

  public data = [];
  public apiData: any;
  public loading = false;
  public noData = false;
  p: number = 1;
  faSearch = faSearch;
  faRedo = faRedo;
  faHeadphones = faHeadphones;
  faExternalLinkAlt = faExternalLinkAlt;
  searchQuery : string = "";

  constructor(private service: ApiService) { }

  getAll() {
    this.service.getAll(this.searchQuery).subscribe((results) => {
      this.loading = true;
      console.log('Data is received - Result - ', results);
      this.data = results.results;
      this.loading = false;

      if (this.data.length <= 0) {
        this.noData = true;
      } else if (this.data.length >= 1) {
        this.noData = false;
      } else {
        this.noData = true;
      }
    })
  }

  refresh(): void {
    window.location.reload();
  }  

  Search(){
   this.service.getAll(this.searchQuery).subscribe((results) => {
      this.loading = true;
      console.log('Data is received - Result - ', results);
      this.data = results.results;
      this.loading = false;
    })
  }
  ngOnInit() {

  }
}

从'@angular/core'导入{Component，OnInit}；
从“../../../services/api.service”导入{ApiService}；
从'@angular/forms'导入{FormGroup，FormControl}；
从'@angular/forms'导入{FormBuilder}；
从“@fortwome/free solid svg icons”导入{faSearch}；
从“@fortawesome/free solid svg icons”导入{faRedo}；
从“@fortwome/free solid svg icons”导入{faHeadphones}；
从“@fortwome/free solid svg icons”导入{faExternalLinkAlt}；
@组成部分({
选择器：“应用程序内容”，
templateUrl:'./content.component.html'，
样式URL:['./content.component.scss']
})
导出类ContentComponent{
公共数据=[]；
公共数据：任何；
公共加载=错误；
公共noData=false；
p：数字=1；
faSearch=faSearch；
法雷多=法雷多；
faHeadphones=faHeadphones；
faExternalLinkAlt=faExternalLinkAlt；
searchQuery:string=“”；
构造函数（私有服务：ApiService）{}
getAll（）{
this.service.getAll（this.searchQuery）.subscribe（（结果）=>{
这是。加载=真；
log（'接收到数据-结果-'，结果）；
this.data=results.results；
这一点：加载=错误；
如果（this.data.length=1）{
this.noData=false；
}否则{
this.noData=true；
}
})
}
刷新（）：无效{
window.location.reload（）；
}  
搜索（）{
this.service.getAll（this.searchQuery）.subscribe（（结果）=>{
这是。加载=真；
log（'接收到数据-结果-'，结果）；
this.data=results.results；
这一点：加载=错误；
})
}
恩戈尼尼特（）{
}
}

如果我错了，请纠正我，根据我的理解，您希望将rest API的查询结果添加到现有的歌曲数组（即数据）中。例如，您可以使用扩展运算符的幂

  Search(){
      this.service.getAll(this.searchQuery).subscribe((results) => {
      this.loading = true;
      console.log('Data is received - Result - ', results);
      this.data = [...this.data,...results.results]; // spread operator 
      this.loading = false;
    })
  }

---

如果在组件的.ts文件中，查询结果位于变量

songs

（这就是this.data），则可以在组件的.html中

<ng-container *ngFor="let song of songs">
    <button type="button" (click)="addSongToPlaylist(song)">Add Song {{ song.name }}</button>
</ng-container>

---

你是在问如何将一个对象推送到javascript中的数组吗？它是一个从rest api到数组的对象。如果你想将results.results作为索引，只需这样做。data.push（results.results）。此外，this.data.length>=1是一个无用的比较，您可以使用this.data.length检查数组中是否至少有一个元素。对象来自何处并不重要。如果要将某个内容推送到数组中，请使用

push

。如果您从api获得一个数组，那么将其分配给一个变量。因此只需使用

this.data.push（results.results）并将其添加到（单击）函数中。谢谢Raj，但需要一个单独的单击函数将相关对象从rest api推送到数组中。
addSongToPlaylist(song) {
    this.playlist.push(song);
}