Как мне дождаться ответа от модального окна начальной загрузки Angular перед выполнением следующей функции? - PullRequest
Новая
       36

Как мне дождаться ответа от модального окна начальной загрузки Angular перед выполнением следующей функции?

0 голосов
/ 26 апреля 2019

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

Модальное окно начальной загрузки работает, но если я поместил func x () в строку (click) = для кнопки, x () будет запущен, пока отображается модальное окно.

Другая трудность заключается в том, что я пытаюсь использовать модальное окно для трех потенциальных запросов на обновление базы данных (удалить, опубликовать или поместить), поэтому x () должен быть динамическим в зависимости от того, какая кнопка открыла модальное окно.

Модальное окно начальной загрузки работает, но если я поместил func x () в строку (click) = для кнопки, x () выполнится, пока отображается модальное значение.

Другая трудность заключается в том, что я пытаюсь использовать модальное окно для трех потенциальных запросов на обновление базы данных (удалить, опубликовать или поместить), поэтому x () должен быть динамическим в зависимости от того, какая кнопка открыла модальное окно.

HTML 

<span *ngIf="!isCurrent">
                                    <button class="entry" id="add" (click)="openProofWindow(proof, 'add');">Add</button>&nbsp;&nbsp;
                                </span>
                                <span *ngIf="isCurrent">
                                    <button class="entry" id="update" (click)="openProofWindow(proof, 'update');">Update</button>&nbsp;&nbsp; <!--updateRequest();-->
                                    <button class="entry" id="delete" (click)="openProofWindow(proof, 'delete');">Delete</button>&nbsp;&nbsp;
                                </span>

код ts 

 openProofWindow(content, target): void {
 this.modalService.open(content, target);

Я пытался: 

(click)="openProofWindow(proof, 'add');addRecord();"

но это выполняется до закрытия модала.

Это модальное окно (HTML) 

<div class="modal-header container">
        <div class="row">
            <h4 class="modal-title col-7">Proof Copy</h4>
            <button type="button" class="btn col-2 btn-modal" aria-label="no" (click)="modal.dismiss('cancel click')">
                    <span aria-hidden="true">No</span>
                </button>
            <button type="button" class="btn col-2 btn-modal btn-success" aria-label="ok" ngbAutofocus (click)="modal.close('Ok click');">
                <span aria-hidden="true">Ok</span>
            </button>
        </div>
    </div>

Ничего не должно происходить, пока пользователь не выберет ОК или Нет.

Если пользователь выбирает ОК, в зависимости от того, было ли модальное окно открыто как запрос на добавление, удаление или обновление (вставка, удаление, публикация), должна быть вызвана соответствующая функция - и модальное окно закрыто.

Ответы [ 2 ]

0 голосов
/ 26 апреля 2019

Я нашел ответ:

в: 

openProofWindow(content, target): void {
 this.modalService.open(content, target);

вместо добавления параметра в modalService.open, я установил публичную переменную. 

public updateType: string;

openProofWindow(content, target): void {
this.updateType = target;
 this.modalService.open(content);

Затем в кнопке «ОК» я делаю дополнительный вызов: 

<button type="button" class="btn col-2 btn-modal btn-success" aria-label="ok" ngbAutofocus (click)="confirmedEdit(); modal.close('Ok click');">
                <span aria-hidden="true">Ok</span>

Мне нужно добавить функцию для ссылки на набор переменных: 

confirmedEdit(): void {
  console.log(this.updateType);
}

Это работает.

0 голосов
/ 26 апреля 2019

Вы можете использовать это 

this.modalService.afterClosed().subscribe(result => {
  console.log('The dialog was closed');
  this.animal = result;
});

Я также хотел бы сослаться на документацию материала здесь

...