Угловой материал: всплывающее окно: отправка данных родителю, когда окно открыто и нажатие кнопки
Как мне получить значение диалогового окна Angular Material и отправить его родителю?
Я знаю, как получить данные после закрытия диалогового окна. Просто любопытно, как получить данные, пока диалоговое окно все еще открыто, или, в частности, когда человек нажимает кнопку в диалоговом окне.
public openPropertySearchDialog(): void {
const propertySearchDialogRef = this.propertySearchDialog.open(PropertyGridDialogComponent,
{
width: '1500px',
height: '950px',
data: this.propertyList,
hasBackdrop: false
});
propertySearchDialogRef.afterClosed().subscribe(result => {
console.log('propertyResult', result);
});
}
Обновить:
Это подпишется на данные. Теперь мне нужно знать только данные, когда кнопка нажата внутри компонента Dialog. Подумываю добавить еще одну подписку для события нажатия кнопки, ищу чистый способ вместо добавления двух подписок.
propertySearchDialogRef .componentInstance.propertyOutput.subscribe((data: any) => {
console.log('test',data);
});
https://material.angular.io/components/dialog/api
Многие ресурсы в Интернете - это когда окно закрыто, ищет Открыть и нажимает кнопку (которая не закрывает диалоговое окно)
Как передать данные в afterClosed() в диалоговом окне Angular Material в Angular 6
Передать несколько данных из Mat Dialog Angular 4 обратно родителю
1 ответ
В вашем всплывающем компоненте вы можете использовать эмиттер событий вывода.
onAdd = new EventEmitter();
constructor() {
}
onButtonClicked() {
this.onAdd.emit('test');
}
Внутри родительского компонента
openDialog() {
const ref = this._dialog.open(InnerComponent);
const sub = ref.componentInstance.onAdd.subscribe((data) => {
console.log(data);
});
dialogRef.afterClosed().subscribe(() => {
sub.unsubscribe();
});
}
Здесь вы подписываетесь на событие onAdd.
событие генерируется только при нажатии кнопки на вашей кнопке(click)
событие, звонок onButtonClicked()
-