Когда я раскрываю одну вкладку, все каратные стрелки направлены вверх.должны отображаться только выбранные стрелки

Question

введите описание изображения здесь На самом деле есть четыре вкладки, на каждой вкладке есть функция щелчка в каратах.Когда я раскрываю одну вкладку, все каратные стрелки направлены вверх.* только выбранные стрелки должны отображаться

accountSelection(account) {
    if (!this.selectedAccount || account.accountId !== this.selectedAccount.accountId) {
      this.selectedAccount = account;
      this.selectedAccountTransactions = this.transactionData.unrealizedGainLossDetails.filter(acc => acc.accountId === this.selectedAccount.accountId);
      this.initialPaging();
    } else {
      this.selectedAccount = undefined;
      this.selectedAccountTransactions = undefined;
      this.unrealizedTransaction = undefined;
    }
    this.cd.detectChanges();
  }

<span class="col-md-1 p-0 acc-carat col-sm-1" (click)="accountSelection(account)" *ngIf="!transactionsInfo.loading">
                            <i _ngcontent-c2="" *ngIf="!selectedAccount " class="fa fa-caret-down" aria-hidden="true"></i>
                            <i _ngcontent-c2="" *ngIf="selectedAccount" class="fa fa-caret-up" aria-hidden="true"></i>
                    </span>
                    

Answer 1

Даже вы можете установить, используя новое свойство объекта, как это -

<span class="col-md-1 p-0 acc-carat col-sm-1" (click)="accountSelection(account)" *ngIf="!transactionsInfo.loading">
    <i _ngcontent-c2="" *ngIf="account?.open" class="fa fa-caret-down" aria-hidden="true"></i>
    <i _ngcontent-c2="" *ngIf="!account?.open" class="fa fa-caret-up" aria-hidden="true"></i>
</span>

accountSelection(account) {
    ..... //Set (open = false) for every item in array
    account.open = true;
    this.cd.detectChanges();
  }

Прямо сейчас вы используете глобальную переменную selectedAccount, которая обновляется каждый раз, когда вы вызываете функцию.