Я не могу найти элемент из массива, который хранит массив из службы. В выводе консоли всегда показывается неопределенное сообщение

Question

Вот мой код компонента. В этом коде я сохранил все данные в локальном массиве, чтобы найти элемент из этого массива. Но когда я пытаюсь получить элемент из этого массива, он показывает неопределенное.

   //-------------------------------------------------------------           
    Component.ts
            export class AccountsComponent implements OnInit
            {
                retVal = [];
                constructor(
                public service:AccountingService) 
                { 
                    this.service.getAccounts().forEach(item=>{
                    this.retVal.push(item['chartofaccount']); // Locally stored the value to an array//
                    });      
                }

                ngOnInit() 
                {
                    console.log(this.getAccountById(2));
                }
                getAccountById(id)
                {
                    return this.retVal.find(x => x.id === id);  // Return value showed undefined//
                }
            }    //-------------------------------------------------------------   
            Service.ts
             getAccounts():Observable<ChartOfAccount[]>
                {
                    return this._htc.get<ChartOfAccount[]>(this.apiUrl+'chart-of-account', httpOptions)
                    .pipe(
                        tap(data => console.log("Data:", data)),   
                        ); 
                }

Answer 1

Попробуйте вызывать ваши сервисные методы в новом методе вашего компонента вместо конструктора.

Этот подход должен решить вашу проблему.

Почему? Angular: вызов функции в конструкторе

https://www.angularjswiki.com/angular/what-is-the-difference-between-constructor-and-ngoninit-in-angular/

// ------------- ------------------------------------------------
Класс экспорта Component.ts AccountsComponent реализует OnInit {retVal = []; конструктор (publi c service: AccountingService) {

                });      
            }

            ngOnInit() 
            {   this.getAccountsData();
                console.log(this.getAccountById(2));
            }
            getAccountsData() {
                this.service.getAccounts().forEach(item=>{
                this.retVal.push(item['chartofaccount']); // Locally stored the value to an array//
                }); 
            }
            getAccountById(id)
            {
                return this.retVal.find(x => x.id === id);  // Return value showed undefined//
            }
        }    //-------------------------------------------------------------