Question

当我点击打开它关闭的模态时我试过这个例子bootstrap modal 搜索后我猜这个错误来自加载NgbModal多次倍数。但我只在module.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

创建一个具有不透明度值并设置为1的css类。将此css类添加到模式选项中。这对我有用。

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';
  }

将NgbModalOptions导入组件并使用选项

打开模式

const result = [
  {
    email: 'jaiswal.shubham84@gmail.com',
    profile: './image/jaiswal.shubham84@gmail.com/6.jpg'
  },
  {
    email: 'sj1303058@gmail.com',
    profile: './image/sj1303058@gmail.com/5.jpg'
  }
];

const jaiswal = result.find(it => it.email === 'jaiswal.shubham84@gmail.com');
console.log(jaiswal);

模态自举角2立即关闭

1 个答案: