Skip to main content
se añadieron 1041 caracteres en el cuerpo
Origen Enlace

Necesito que al entrar en mi sitio web mi modal se abra automáticamente, uso NgbModal. Os dejo mi código angular y también os dejo lo que probé a hacer. Actualmente solamente se me abre si hago click en un botón pero claro, yo necesito que abra sin necesidad de hacer click.

import { NgbModal, NgbModalRef, NgbModalConfig } from '@ng-bootstrap/ng-bootstrap';

// Constructor  
protected modalService: NgbModal,
config: NgbModalConfig

// Abrimos la modal 
openLg(content) {
    this.modalService.open(content, { size: 'lg', centered: true});
}

HTML

<ng-template #content let-modal>
    <div class="modal-header">
      <h5 class="modal-title"><i class="fas fa-exclamation-circle"></i> Tu licencia expirará pronto</h5>
      <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>Tu licencia expirará en {{diffInDays}} días, tienes hasta el día {{fecha_renovacion | date:'dd-MM-yyyy'}} para poder renovar tu licencia. También puedes renovar tu licencia en este mismo momento.</p>
    </div>
</ng-template>

Probé a ejecutar la función openLg(content); en el momento que cargo la página pero me dice que content no está declarado, vaya que no me deja pasarle content.

EDITADO

    export class AppComponent implements DoCheck, OnInit, OnDestroy, AfterViewInit {
      @ViewChild('content') contenidoDelModal;
      ngAfterViewInit() {
        this.openLg();
      }
      public content:any;
      public empleado: Empleado;
      public primaryColor: string;
      public secondaryColor: string;
      public pieColor: string;
      public modal : NgbModalRef;
      public ocultar_en_produccion: boolean;
      public today = new Date();
      public diffInDays: number;
      public fecha_actual_renovacion:any;
    
      constructor(
        protected _mensajesService: MensajesService,
        protected _configService: ConfigService,
        protected _authService: AuthService,
        protected _styleService: StyleService,
      }
    
      openLg() {
        this.modalService.open(this.contenidoDelModal, { size: 'lg', centered: true })
      }
}

Necesito que al entrar en mi sitio web mi modal se abra automáticamente, uso NgbModal. Os dejo mi código angular y también os dejo lo que probé a hacer. Actualmente solamente se me abre si hago click en un botón pero claro, yo necesito que abra sin necesidad de hacer click.

import { NgbModal, NgbModalRef, NgbModalConfig } from '@ng-bootstrap/ng-bootstrap';

// Constructor  
protected modalService: NgbModal,
config: NgbModalConfig

// Abrimos la modal 
openLg(content) {
    this.modalService.open(content, { size: 'lg', centered: true});
}

HTML

<ng-template #content let-modal>
    <div class="modal-header">
      <h5 class="modal-title"><i class="fas fa-exclamation-circle"></i> Tu licencia expirará pronto</h5>
      <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>Tu licencia expirará en {{diffInDays}} días, tienes hasta el día {{fecha_renovacion | date:'dd-MM-yyyy'}} para poder renovar tu licencia. También puedes renovar tu licencia en este mismo momento.</p>
    </div>
</ng-template>

Probé a ejecutar la función openLg(content); en el momento que cargo la página pero me dice que content no está declarado, vaya que no me deja pasarle content.

Necesito que al entrar en mi sitio web mi modal se abra automáticamente, uso NgbModal. Os dejo mi código angular y también os dejo lo que probé a hacer. Actualmente solamente se me abre si hago click en un botón pero claro, yo necesito que abra sin necesidad de hacer click.

import { NgbModal, NgbModalRef, NgbModalConfig } from '@ng-bootstrap/ng-bootstrap';

// Constructor  
protected modalService: NgbModal,
config: NgbModalConfig

// Abrimos la modal 
openLg(content) {
    this.modalService.open(content, { size: 'lg', centered: true});
}

HTML

<ng-template #content let-modal>
    <div class="modal-header">
      <h5 class="modal-title"><i class="fas fa-exclamation-circle"></i> Tu licencia expirará pronto</h5>
      <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>Tu licencia expirará en {{diffInDays}} días, tienes hasta el día {{fecha_renovacion | date:'dd-MM-yyyy'}} para poder renovar tu licencia. También puedes renovar tu licencia en este mismo momento.</p>
    </div>
</ng-template>

Probé a ejecutar la función openLg(content); en el momento que cargo la página pero me dice que content no está declarado, vaya que no me deja pasarle content.

EDITADO

    export class AppComponent implements DoCheck, OnInit, OnDestroy, AfterViewInit {
      @ViewChild('content') contenidoDelModal;
      ngAfterViewInit() {
        this.openLg();
      }
      public content:any;
      public empleado: Empleado;
      public primaryColor: string;
      public secondaryColor: string;
      public pieColor: string;
      public modal : NgbModalRef;
      public ocultar_en_produccion: boolean;
      public today = new Date();
      public diffInDays: number;
      public fecha_actual_renovacion:any;
    
      constructor(
        protected _mensajesService: MensajesService,
        protected _configService: ConfigService,
        protected _authService: AuthService,
        protected _styleService: StyleService,
      }
    
      openLg() {
        this.modalService.open(this.contenidoDelModal, { size: 'lg', centered: true })
      }
}
Origen Enlace

Abrir modal automáticamente al entrar

Necesito que al entrar en mi sitio web mi modal se abra automáticamente, uso NgbModal. Os dejo mi código angular y también os dejo lo que probé a hacer. Actualmente solamente se me abre si hago click en un botón pero claro, yo necesito que abra sin necesidad de hacer click.

import { NgbModal, NgbModalRef, NgbModalConfig } from '@ng-bootstrap/ng-bootstrap';

// Constructor  
protected modalService: NgbModal,
config: NgbModalConfig

// Abrimos la modal 
openLg(content) {
    this.modalService.open(content, { size: 'lg', centered: true});
}

HTML

<ng-template #content let-modal>
    <div class="modal-header">
      <h5 class="modal-title"><i class="fas fa-exclamation-circle"></i> Tu licencia expirará pronto</h5>
      <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>Tu licencia expirará en {{diffInDays}} días, tienes hasta el día {{fecha_renovacion | date:'dd-MM-yyyy'}} para poder renovar tu licencia. También puedes renovar tu licencia en este mismo momento.</p>
    </div>
</ng-template>

Probé a ejecutar la función openLg(content); en el momento que cargo la página pero me dice que content no está declarado, vaya que no me deja pasarle content.