Как создать модал ng-bootstrap с постоянным компонентом?

Я пытаюсь реализовать модальность с angular, следуя этому руководству (https://ng-bootstrap.github.io/#/components/modal - раздел «Компоненты как содержимое»), но я хочу, чтобы компонент, отображаемый в модальном окне, сохранял свое состояние после закрытия при следующем открытии.

Я создал простой пример Plunker: http://plnkr.co/edit/EJyZ6nF5WVAS9bvQycQe?p=preview

Чего я хочу добиться, так это того, чтобы вызов open() после вызова openA() отображал текст «Привет, А!» но это не сохранение состояния.

openA() {
  const modalRef = this.modalService.open(NgbdModalContent);
  modalRef.componentInstance.name = 'A';
}

openB() {
  const modalRef = this.modalService.open(NgbdModalContent);
  modalRef.componentInstance.name = 'B';
}

open() {
  const modalRef = this.modalService.open(NgbdModalContent);
}

¿Как можно создать эту минимальную настройку? ¿Или какую угловую документацию вы рекомендуете, чтобы понять, что происходит?


typescript angular modal-dialog ng-bootstrap
person rogelius    schedule 16.05.2017    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Каждый раз, когда новое модальное окно открывается с компонентом в качестве содержимого, указанный компонент будет воссоздан (и уничтожен при закрытии модального окна). В этом смысле вы не можете «сохранять» экземпляры компонентов.

Вместо этого вы должны сохранить модель (данные), которая управляет отображением и поведением компонента.

person pkozlowski.opensource    schedule 16.05.2017
comment
Дело в том, что компонент содержит другой компонент, которому требуется много времени для инициализации, прежде чем он будет готов к показу (очень сложная форма), поэтому я хочу сохранить компонент. ¿Можно ли скрыть модальное окно, по крайней мере, до тех пор, пока компонент не будет готов? Благодарю вас! - person rogelius; 17.05.2017