title: Why is my Angular Service not assigning a filtered result to my property?
body: <p>I setup a service called 'bankService' which is being used by my 'user' component. The 'user' component is receiving the data from the service correctly but I am unable to assign a filtered result to my 'currentAccount' property. I am filtering by 'id' from the list of 'accounts' that is being returned from my service. Any help with an explanation would be appreciated!</p>
  <p><strong>Model</strong></p>
  <pre><code>export interface Account {
    id: number;
    accountHolder: string;
    checking: number;
    savings: number;
  }
  </code></pre>
  <p><strong>Service</strong></p>
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpClient, HttpHeaders } from '@angular/common/http';
  import { elementAt, Observable } from 'rxjs';
  import { Account } from '../models/Account';
  import { Transaction } from '../models/Transaction';
  
  @Injectable({
    providedIn: 'root',
  })
  export class BankServiceService {
    private apiUrl = 'http://localhost:5000/accounts';
  
    constructor(private http: HttpClient) {}
  
    getAccounts(): Observable&lt;Account[]&gt; {
      return this.http.get&lt;Account[]&gt;(this.apiUrl);
    }
  }
  </code></pre>
  <p><strong>Component</strong></p>
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { ActivatedRoute } from '@angular/router';
  import { Account } from 'src/app/models/Account';
  import { BankServiceService } from 'src/app/services/bank-service.service';
  
  @Component({
    selector: 'app-user',
    templateUrl: './user.component.html',
    styleUrls: ['./user.component.css'],
  })
  export class UserComponent implements OnInit {
    currentAccount: Account[] = [];
    accountId: number;
    accountHolder: string;
    checkingAmount: number;
    savingsAmount: number;
  
    constructor(
      private route: ActivatedRoute,
      private bankService: BankServiceService
    ) {}
  
    ngOnInit(): void {
      // gets the parameter for the url (the param is the account id)
      this.accountId = this.route.snapshot.params['id'];
      console.log('id: ', this.accountId);
  
      // pulls in all accounts
      this.bankService
        .getAccounts()
        .subscribe(
          (accounts) =&gt;
            (this.currentAccount = accounts.filter(
              (account) =&gt; account.id === this.accountId
            ))
        );
  
      console.log('current account: ', this.currentAccount);
    }
  }
  </code></pre>