Как назначить объект из массива переменной?

Question

Я пытаюсь назначить объект из массива, у этого массива всегда будет 1 объект, потому что я отфильтровал его при вызове функции.

У меня есть currentAccount: UserAccount[]; массив, который я знаюнаверняка есть только один объект типа UserAccount. Я пытаюсь присвоить этот единственный объект самому переменному объекту account: UserAccount; вместо того, чтобы оставить его как массив. Это мой account.component.ts:

currentUser: User;
currentAccount: UserAccount[];
account: UserAccount;

constructor(
  private alertService: AlertService,
  private userService: UserService,
  private authenticationService: AuthenticationService,
) {
  this.authenticationService.currentUser.subscribe(
    x => (this.currentUser = x)
  );
}

ngOnInit(): void {
    this.getCurrentAccount();
    this.currentAccount.map(obj => {
      this.account = obj;
    });
  }

getCurrentAccount() {
    this.userService.getAllUserAccounts().subscribe(
      (data: UserAccount[]) => {
        console.log(data);
        this.currentAccount = data.filter(
          x => x.accountName === this.currentUser.firstName
        );
      },
      error => {
        this.alertService.error('Could not retrieve user account ID');
      }
    );
  }

Я пытался .map() и .forEach() в моем ngOnInit(), чтобы попытаться извлечь этот объект из массива и сопоставить его с моим account. Я просто не мог понять это.

Однако стоит отметить, что всякий раз, когда я пытаюсь получить объект с помощью любых методов массива, моя консоль выдает ошибку при загрузке страницы:

ERROR TypeError: Cannot read property 'map' of undefined
    at ViewAccountPayableComponent.ngOnInit (view-account-payable.component.ts:35)
    at checkAndUpdateDirectiveInline (core.js:31909)
    at checkAndUpdateNodeInline (core.js:44366)
    at checkAndUpdateNode (core.js:44305)
    at debugCheckAndUpdateNode (core.js:45327)
    at debugCheckDirectivesFn (core.js:45270)
    at Object.eval [as updateDirectives] (ViewAccountPayableComponent_Host.ngfactory.js? [sm]:1)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:45258)
    at checkAndUpdateView (core.js:44270)
    at callViewAction (core.js:44636)

Я хочу извлечь еепотому что я хочу использовать атрибуты в UserAccount.

Answer 1

Причина в том, что this.currentAccount пусто, данные извлекаются асинхронно, и вы пытаетесь использовать .map перед извлечением данных.

Переместите часть назначения в логике следующим образом:

getCurrentAccount() {
    this.userService.getAllUserAccounts().subscribe(
      (data: UserAccount[]) => {
        console.log(data);
        this.currentAccount = data.filter(
          x => x.accountName === this.currentUser.firstName
        );
        this.currentAccount.map(obj => {
         this.account = obj;
        });
      },
      error => {
        this.alertService.error('Could not retrieve user account ID');
      }
    );
  }

Answer 2

это должно сделать работу за вас:

this.userService.getAllUserAccounts().subscribe(
  (data: UserAccount[]) => {
    console.log(data);
    if (data) {
      this.account = data.find(x => x.accountName === this.currentUser.firstName);
    };
  },
  error => {
    this.alertService.error('Could not retrieve user account ID');
  }
);