我想在使用angular和bootstrap打开组件模态时更改设置

时间:2019-07-20 12:59:39

标签: typescript modal-dialog angular6 bootstrap-modal settings

打开模态后,我想根据用户的特定要求控制模态的关闭。

但是它不符合我想要的方式。

Angular6和ngx-bootstrap


如何在打开模块时更改模式设置?


import { Component, OnInit } from '@angular/core';
import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
import { BsModalService } from 'ngx-bootstrap/modal';
import { NSettingsComponent } from '../n-settings/n-settings.component';

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.scss'],
})
export class HeaderComponent implements OnInit {
  modalConfig:any = {
    class: 'gray modal-lg',
    keyboard: true,
    backdrop: true,
    ignoreBackdropClick: false
  };

  constructor(private modalRef: BsModalRef, private modalService: BsModalService){}

  ngOnInit() {
    this.openModal();
  }

  openModal() {
    this.modalRef = this.modalService.show(NSettingsComponent, this.settingModalConfig);

    this.modalRef.content.event.subscribe( res => {
      this.settingModalConfig.keyboard = res.keyboard;
      this.settingModalConfig.backdrop = res.backdrop;
      this.settingModalConfig.ignoreBackdropClick = res.ignoreBackdropClick;

      // { "class": "gray modal-lg", "keyboard": false, "backdrop": "static", "ignoreBackdropClick": false }

    });
  }
}

0 个答案:

没有答案