закрытый вопрос Mat-dialogBox - PullRequest
0 голосов
/ 03 декабря 2018

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

Может кто-нибудь помочь мне решить эту проблему?Я пытался сделать все, но все еще не определено.Любая помощь будет хорошей.

Пожалуйста, найдите мой код ниже.

raster.component.ts

  openDialogbox(value): void {
    this.emptyTile = value;
    const dialogRef = this.dialog.open(AddNewFlyerComponent, {
      width: '100em',
      height: '50em',
      data: {
        flyerArray: this.flyers,
        emptyPosition: this.emptyTile,
        page: this.flyers[0].Seite,
        year: this.flyers[0].Jahr,
        week: this.flyers[0].KW,
      }
    });

    dialogRef.afterClosed().subscribe(result => {
      console.log('The raster dialog was closed', result);
    });
  }

AddNewFlyerComponent.ts

  openDialog(werbenumber): void {
    const dialogRef = this.dialog.open(CreateNewFlyerComponent, {
      width: '100em',
      height: '50em',
      data: {
        flyerArray: this.data.flyerArray,
        werbenumber: werbenumber,
        emptyTile: this.data.emptyPosition,
        page: this.data.page,
        week: this.data.week,
        year: this.data.year
      }
    });

    dialogRef.afterClosed().subscribe(result => {
      console.log('The 1st dialog was closed', result); // getting undefined
    });
  }

CreateNewFlyerComponent.ts

  addFlyerToEmptyPosition(werbedata: WerbeData) {
    const newFlyer = {
      ArtNr: this.werbedata.ArtNr,
      Filiale: this.werbedata.FILIALE,
      Jahr: this.data.flyerArray[0].Jahr,
      KW: this.data.flyerArray[0].KW,
      Pos: this.data.emptyTile,
      Raster: this.data.flyerArray[0].Raster,
      Seite: this.data.flyerArray[0].Seite,
      WERBE_NR: this.werbedata.WERBE_NR,
      EUR_VK: this.a,
      EUR_VK_Einheit: this.b,
      VK_Einheit: this.c
    };
    this.flyerHammService.createNewFlyer(newFlyer)
      .then(
        (response: any) => {
          this.returnFlyer = response.data[0]; // This returnFlyer, I want to pass
          this.matSnackBar.open('Neuer Flyer wurde erstellt', 'Undo', {
            duration: 3000
          });
        }
      ).catch(
        error => console.log(error)
      );
  }

CreateNewFlyerComponent.ts

  <button mat-dialog-close mat-raised-button [color]="'success'" [mat-dialog-close]="returnFlyer" (click)="addFlyerToEmptyPosition(werbedata)">
    {{ 'SPEICHERN' }}
    <mat-icon>save</mat-icon>
  </button>

1 Ответ

0 голосов
/ 03 декабря 2018

Используйте один и тот же объект данных для обоих диалогов.Вместо создания нового объекта обновите исходный объект данных дополнительными данными и передайте его во второй диалог:

AddNewFlyerComponent.ts

openDialog(werbenumber): void {

  this.data.emptyTile = this.data.emptyPosition; // or was that a typo?
  this.data.werbenumber = werbenumber; // or use Object.defineProperty()

  const dialogRef = this.dialog.open(CreateNewFlyerComponent, {
    width: '100em',
    height: '50em',
    this.data
  });

  dialogRef.afterClosed().subscribe(result => {
    console.log('The 1st dialog was closed', result); // getting undefined
  });
}

Чтобы передать данные обратно в растр, используйтетот же подход:

raster.component.ts

data;

openDialogbox(value): void {
  this.emptyTile = value;
  this.data = {
    flyerArray: this.flyers,
    emptyPosition: this.emptyTile,
    page: this.flyers[0].Seite,
    year: this.flyers[0].Jahr,
    week: this.flyers[0].KW,
  }
  const dialogRef = this.dialog.open(AddNewFlyerComponent, {
    width: '100em',
    height: '50em',
    data: this.data
  });

  dialogRef.afterClosed().subscribe(result => {
    console.log('The raster dialog was closed', result);
  });
}
...