Преобразование объекта в массив против написания двух отдельных методов - PullRequest
Новая
       6

Преобразование объекта в массив против написания двух отдельных методов

0 голосов
/ 20 апреля 2020

В моем приложении angular 8 есть компонент соглашения, который используется для отображения модального всплывающего окна. Это модальное всплывающее окно вызывается из двух разных компонентов. Один - это AppComponent, а второй - компонент истории. AppComponent инициирует вызов метода сервиса, который возвращается как коллекция массивов, в то время как компонент History вызывает метод сервиса, чтобы вернуть объект с одной записью. Компонент Соглашения, который используется для всплывающего окна, в настоящее время поддерживает отображение только данных из массива, но не объекта. Каков наилучший способ решить эту проблему. Я искал способ преобразования объекта в массив с использованием метода значений из библиотеки loda sh, но это, похоже, не работает.

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

Итак, я объявил свойство с именем publi c loadSingleAgreement: boolean; в сервисе и будет вызывать это из любого компонента перед загрузкой модального. Вы можете видеть, как я инициализирую this.agreementData в обоих методах в компоненте соглашения. Один - это массив, а другой - объект.

AppComponent 

this.agreementsService.loadSingleAgreement = false;
this.loadModalDialog();

public loadModalDialog() {
  console.log('inside AppComponent');
  this.agreementsService.loadSingleAgreement = false;
  this.modal = this.modalService.open(AgreementComponent, { size: 'lg', centered: true , backdrop: 'static', keyboard: false});
}

HistoryComponent 

this.agreementsService.agreementUserId = 12;
this.agreementsService.loadSingleAgreement = true;
this.loadModalDialog();

public loadModalDialog() {
  console.log('inside HistoryComponent');
  this.agreementsService.loadSingleAgreement = false;
  this.modal = this.modalService.open(AgreementComponent, { size: 'lg', centered: true , backdrop: 'static', keyboard: false});
}

Компонент соглашения 

ngOnInit() {
  console.log('ngOnit of Agreement component fired');

  if (!this.agreementsService.loadSingleAgreement) {
    this.getOutstandingAgreements();
  } else {
    this.getAgreement();
  }   
}

public getOutstandingAgreements() {
  this.agreementsService
    .getOutstandingAgreements()
    .subscribe((data: AgreementsModel[]) => {
      if (data.length > 0) {
        this.myData = data;
        this.agreementData = this.myData[0].data;
        this.agreementLength = this.myData.length;
        this.SetWarningMessage(0);
      }
    });
}

public getAgreement() {
  this.loading = true;
  this.agreementsService
    .getAgreement(this.agreementsService.agreementUserId)
    .subscribe((data: AgreementsModel) => {
      if (data) {
        this.agreementData = data;
        this.showAgreementReadOnly = data.userAgreementStateId === 3 ? true : false;
        if (this.showAgreementReadOnly) {
          this.router.navigate(['agreements-readonly', this.agreementsService.agreementUserId], { relativeTo: this.route.parent });
        }
      }
    });
}
...