モーダルはすぐ

Question

を閉じます。 TSと、このコンポーネント

import { Component, Input } from '@angular/core'; 
import {NgbModal, NgbActiveModal} from '@ng-bootstrap/ng-bootstrap'; 

@Component({ 
    selector: 'ngbd-modal-content', 
    template: ` 
    <div class="modal-header"> 
     <h4 class="modal-title"></h4> 
     <button class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')"> 
     <span aria-hidden="true">&times;</span> 
     </button> 
    </div> 
    <div class="modal-body"> a</div> 
    <div class="modal-footer"> 
     <button type="button" class="btn btn-secondary" (click)="activeModal.close('Close click')">Close</button> 
    </div>` 

}) 


export class NgbdModalContent { 
    @Input() name; 

    constructor(public activeModal: NgbActiveModal) {} 
} 

@Component({ 
    selector: 'app-modalbs', 
    templateUrl: './modalbs.component.html', 
    styleUrls: ['./modalbs.component.css'] 
}) 
export class ModalbsComponent { 

    constructor(private modalService: NgbModal) {} 

    open() { 
    console.log("open"); 
    const modalRef = this.modalService.open(NgbdModalContent); 
    modalRef.componentInstance.name = 'World'; 
    } 
} 

とmodule.ts中で：import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; import { ModalbsComponent, NgbdModalContent } from './modalbs/modalbs.component';

Answer 1

不透明度値を持つCSSクラスを作成し、1 を設定するには、あなたのモーダルオプションに、このCSSクラスを追加します。 それは私のために働いています。オプションを使用してコンポーネントとオープンモーダルに

.modal-opened{ 
    opacity: 1 !important; 
} 

輸入NgbModalOptions

import { NgbModalOptions } from '@ng-bootstrap/ng-bootstrap'; 

open() { 
    console.log("open"); 
    let options: NgbModalOptions = {windowClass: 'modal-opened'}; 
    const modalRef = this.modalService.open(NgbdModalContent,options); 
    modalRef.componentInstance.name = 'World'; 
    }