Как обновить данные на Angular Modal от родителя при открытом - PullRequest
0 голосов
/ 19 ноября 2018

Модальное диалоговое окно инициализируется методом open, начальные данные передаются вторым параметром MAT_DIALOG_DATA метода open. Существует обратный вызов для выполнения метода afterClosed (). Тем не менее, внутри Модал, у меня есть сборщик дат. Когда дата изменяется, я хочу получить новые данные от родителя. Я могу определенно позвонить из Модального в службу, чтобы получить данные, но это вызывает избыточность, так как родительский также имеет этот вызов во время инициализации данных. Посоветуйте, пожалуйста, как правильно отправить событие родителю, пока диалог открыт, и получите данные обратно. Вот мой код для инициализации модальной для вашей справки.

let dialogRef1 = this.dialog.open(RentalEditHourlyComponent, {
                    data: {
                        rentalItemId: this.rentalItemId,
                        date: $event.date,
                        timeSlots: this.availableTimeSlots,
                        cards: this.selectedCalendarCards.filter(o => String(o.rentalItemId) === this.rentalItemId),
                        reservations: this.selectedCalendarCards
                    }
                });

                dialogRef1.afterClosed().subscribe(result => {
                    let rental = this.rentalItemHeader;
                    if (result !== undefined) {
                        let model = new CalendarCard({
                            locationId: this.locationId as number,
                            locationDisplay: rental.LocationName,
                            rentalItemId: rental.Id,
                            date: result.date,
                            startTime: result.startTime,
                            endTime: result.endTime,
                            dateDisplay: moment(result.date).format('MM/DD/YYYY'),
                            timeDisplay: moment(result.startTime).format('hh:mm A') + ' - ' + moment(result.endTime).format('hh:mm A'),
                            id: result.id,
                            rentalItemDisplay: rental.Name,
                            halfDaySelectedIndex: 0,
                            fromDate: null,
                            toDate: null
                        });
                        this.addCalendarCard(model);
                    }
                });
...