Why is my array changing after function return?

Question

I have a function, where I filter an array and check whether the property liked of the objects equals one with the help of a checkbox.

  async getGetLikedMatches(checked){
    if(checked){
      await this.sp.getReleases().subscribe(data => {
        this.allMatches = data;
        this.matches = data;
      });
      this.matches = this.allMatches.filter(match => match.favorit == 1);
      console.log({matches: this.matches, allMatches: this.allMatches}); // matches has correctly 6 
                                                                         // elements
      // after the fuction returns matches == allMatches -> 110 element
      // but why?
    }
    else if (!checked){
      await this.sp.getReleases().subscribe(data => {
        this.allMatches = data;
        this.matches = data;
      });
      console.log(this.matches)
    }

In my html file I iterate through those matches:

        <div class="col-3" *ngFor="let match of matches">
            <img [src]="match.images == '' ? url : getImage(match)"
              alt="matches" 
             style="min-width: 200px; max-width: 200px; max-height: 200px; min-height: 200px;"
             (click)="onDetailView(match.id, selectedType)"/> <br />
        </div>

user7499628 · Accepted Answer · 2020-05-29 07:06:15Z

3

I think that you wrong use rxjs, try this

getGetLikedMatches(checked) {
    this.sp.getReleases().subscribe(data => {
       this.allMatches = data;

       if (checked) {
           this.matches = this.allMatches.filter(match => match.favorit == 1);
       } else {
           this.matches = data;
       }

       console.log({ matches: this.matches, allMatches: this.allMatches });
});

}

answered May 29, 2020 at 7:06

user7499628

Sign up to request clarification or add additional context in comments.

2 Comments

Logik Over a year ago

Hey, it is working now! Thank you! I will mark your answer but do you maybe know why my code did not work as expected?

user7499628 Over a year ago

Because subscription is not awaitable, you have to work with data in subscribe method. If you want use await you can do await this.sp.getReleases().toPromise(); and then use filter method on array

Collectives™ on Stack Overflow

Why is my array changing after function return?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related