How to push (smaller) array of pictures into an (larger) array?

Issue

Frameworks Used: Angular + Ionic

Case: I am fetching some data from an API, and I need to show them each in one IonCard, however the array does not contain any picture, so I have locally stored some pictures in my assets file and I have stored the directory of each picture and a name in an array.

So Logically what I need to do is to loop through both arrays and push one picture to every object of the fetched array, but there are some difficulties like following one:

• Size of the pictures array is smaller, meaning some of the IonCards will have no image.

So I just need some help on this function, hope I have clarified the question. Thanks.

Solution

Ok so this is the function that I have written to solve my problem, I thought this might help those who need to merge two arrays with different sizes. FYI, I have written this function in my component's .ts file.

loadedJobs = [];
.
.
.
fetchJobs(){
    this.ws.get<Jobs>('/aplink/jobs')
    .pipe(map(responseData => {
      Object.assign(this.loadedJobs, responseData.models);
        var i: number = 0;
        var n: number = 0;
        while (i < this.loadedJobs.length) {
            this.loadedJobs[i] = Object.assign(this.loadedJobs[i], {
              img: this.people[n].img
            });
            if ((this.people.length)-1 == n){
              n = 0;
            } else {
              n++;
            }
          i++;
          }
    })).subscribe();

  }

Answered By - Mahdiyarsh