Модальное всплывающее окно не работает из @ ng-bootstrap / ng-bootstrap - PullRequest
Новая
       25

Модальное всплывающее окно не работает из @ ng-bootstrap / ng-bootstrap

1 голос
/ 23 мая 2019

Я пытаюсь открыть Ngb Modal с помощью @ ng-bootstrap / ng-bootstrap.

, но всякий раз, когда я пытаюсь открыть Ngb Modal, он не отображается на моем экране.

Я также попытался вызвать предупреждение внутри функции.Функция оповещения вызывается, но модальное всплывающее окно не отображается на моих экранах.

ниже прилагается скриншот. enter image description here

, когда я нажимаю на элементе проверки код ивсе фрагменты информации доступны.

вот мой код.

файл component.html 

<ng-template #content1 let-modal>
      <div class="modal-header">
         <h4 class="modal-title" id="modal-basic-title">Add New Topic</h4>
         <button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
         <span aria-hidden="true">&times;</span>
         </button>
      </div>
      <div class="modal-body">
         <div class="form-style-5">
            <form>
               <div class="form-group">

                  <input type="text" required  style="color=#000000
                     " #tname name="field1" placeholder="Enter Name...">
                  <BR>

                  <input type="text"  style="color=#000000
                     " #sname name="field2" placeholder="Enter Subject...">
               </div>
            </form>
         </div>
      </div>
      <div class="modal-footer">
         <button type="button" class="btn btn-outline-dark" (click)="adddiscussions(tname.value,sname.value);modal.close('Save click')">Save</button>
      </div>
   </ng-template>

файл component.ts

openBackDropCustomClass(content, tp) {
        this.modalService.open(content, {
            backdropClass: 'light-blue-backdrop'
        });
    }


open(content) {
        alert("jayu"); // here I am making alert and it is coming on screen
        this.modalService.open(content, {
            ariaLabelledBy: 'modal-basic-title'
        }).result.then((result) => {
            this.closeResult = `Closed with: ${result}`;
        }, (reason) => {
            this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
        });
    }


    private getDismissReason(reason: any): string {
        if (reason === ModalDismissReasons.ESC) {
            return 'by pressing ESC';
        } else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
            return 'by clicking on a backdrop';
        } else {
            return `with: ${reason}`;
        }
    }

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

Может ли кто-нибудь помочь мне в этом, когда я перепробовал все известные мне способы?

спасибо заранее!

...