Угловой модал не показывать - PullRequest
Новая
       33

Угловой модал не показывать

0 голосов
/ 11 февраля 2019

Обзор:

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

Мои мысли: Я думаю, что я что-то упустил, но документация для меня немного сложна, и я ищу что-то простое

это мой HTML-компонент: 

<ng-template #modalMensaje let-modal>
    <div class="modal-header">
        <h4 class="modal-title">
            <span>{{mensajeInicial.titulo}}</span>
        </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">
        <p> <span>{{mensajeInicial.mensaje}}</span></p>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-outline-dark" (click)="modal.close('Save click')">Save</button>

    </div>
</ng-template>

и это компонент ts: 

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import {ViewChild, ElementRef} from '@angular/core';
import { IMensajeInicial } from 'app/shared/model/mensaje-inicial.model';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
    selector: 'sigem-mensaje-inicial-detail',
    templateUrl: './mensaje-inicial-detail.component.html'
})
export class MensajeInicialDetailComponent implements OnInit {
    mensajeInicial: IMensajeInicial;
    @ViewChild("#modalMensaje") modal: ElementRef;

    constructor(private activatedRoute: ActivatedRoute, private modalService: NgbModal) {}

    ngOnInit() {
        this.activatedRoute.data.subscribe(({ mensajeInicial }) => {
            this.mensajeInicial = mensajeInicial;
            this.abrirModal(this.modal ,mensajeInicial);
        });
    }

    previousState() {
        window.history.back();
    }

    abrirModal(modal, mensajeInicial: any){
        this.mensajeInicial = mensajeInicial;
        this.modalService.open(modal);
    }

}

и вот как это выглядит: enter image description here

Вопросы:

Какой правильный способ показать модальное?

Заметки Как вы видите, я учусь,поэтому я не знаком с Jhipster и Angular ... поэтому, если я пропущу какую-то важную информацию, пожалуйста, прокомментируйте ее, чтобы я мог добавить ее.

...