Свойство 'show' не существует для типа 'ModalContainerComponent' - PullRequest
1 голос
/ 21 февраля 2020

Я использую модель MDB, т.е. ModalContainerComponent для отображения всплывающего окна на экране.

Я буду показывать всплывающее окно при некоторых условиях if.

Но модельpopup.show () выдает ошибку

enter image description here

Может ли кто-нибудь помочь мне с этим?

Это мой .ts код

import { Component, OnInit, Output, EventEmitter, ViewChild } from '@angular/core';
import { BsDatepickerConfig } from 'ngx-bootstrap/datepicker';
import { FormBuilder, FormGroup, Validators} from '@angular/forms';
import { ModalContainerComponent } from 'angular-bootstrap-md';
import { Router } from '@angular/router';
import { BlockUI, NgBlockUI } from 'ng-block-ui';
import 'select2';
import 'jquery-validation-unobtrusive';
import { JWTHelperUtility } from 'src/app/shared/helper';
import { ToastrService } from 'ngx-toastr';
import { HttpErrorResponse } from '@angular/common/http';

export class AccountConfigComponent implements OnInit {
  @ViewChild('conflictBasicModal', { static: true }) conflictBasicModal: ModalContainerComponent;
  
  checkAccountClientConflicts(res) { 
    this.accountConflicts = JSON.parse(res);
    if(this.accountConflicts.length > 0)
    {
      this.conflictBasicModal.show();
    }
    else
    {
      this.accountParams.excludedAccounts='';
      this.onPopupSubmit();
    }
  }
  }

Однако определение класса не содержит метода show ().

import { ElementRef, OnDestroy, OnInit, Renderer2 } from '@angular/core';
import { ModalOptions } from './modal.options';
export declare class ModalContainerComponent implements OnInit, OnDestroy {
    private _renderer;
    modalClass: string;
    tabindex: number;
    role: string;
    modal: boolean;
    private mdbModalService;
    config: ModalOptions;
    isShown: boolean;
    level: number;
    isAnimated: boolean;
    protected _element: ElementRef;
    private isModalHiding;
    private utils;
    onClick(event: any): void;
    onEsc(): void;
    onKeyDown(event: any): void;
    constructor(options: ModalOptions, _element: ElementRef, _renderer: Renderer2);
    ngOnInit(): void;
    focusModalElement(): void;
    updateContainerClass(): void;
    ngOnDestroy(): void;
    hide(): void;
 }

1 Ответ

1 голос
/ 21 февраля 2020

Вы объявляете ваш модальный как неправильный тип в вашем компоненте.

Вместо ModalContainerComponent, это должно быть ModalDirective. Вы объявили эту директиву в своем HTML, и именно так вы подключаетесь к ее методам.

@ViewChild('conflictBasicModal', { static: true }) 
modal: ModalDirective;

showModal() {
  this.modal.show();
}  

DEMO: https://stackblitz.com/edit/angular-8i6to4

Я нашел правильный тип, читая официальные документы: https://mdbootstrap.com/docs/angular/modals/basic/#a -директивы

...