как переключать строки с помощью angular8

Question

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

DEMO: DEMO

TS:

 editEo(eo,index) {

      if(this.eoInfoForm.dirty) {

        this.confirmationDialogService.confirm('Please confirm..', 'Do you really want to save changes ?')
    .then((confirmed) => {
         let openedIndex = this.eoList.findIndex(obj => obj.OpenCloseStatus === true);
        confirmed ? this.OpenCloseEvent(eo,openedIndex):this.OpenCloseEvent(eo,index);
      if(confirmed){
        console.log("works")
      }
    })
    .catch(() => console.log('User dismissed the dialog (e.g., by using ESC, clicking the cross icon, or clicking outside the dialog)'));

  }else {
          //  this.eoDetailsList = previous; 
           eo.isCollapse = !eo.isCollapse
           this.OpenCloseEvent(eo,index);
          }
  }

HTML:

 <a href="javascript:void(0);" (click)="editEo(eo,i)" class="accordion-toggle">+ </a>

Answer 1

Просто замените строку:

this.eoList[objIndex]['OpenCloseStatus'] = true;

на:

this.eoList[objIndex]['OpenCloseStatus'] = !this.eoList[objIndex]['OpenCloseStatus'];