Bootstrap 4 в Angular 7 не работает - PullRequest
Новая
       8

Bootstrap 4 в Angular 7 не работает

0 голосов
/ 01 июля 2019

Я имею дело с 2 дочерними компонентами. Один должен вызвать модальное другого

первоклассников component.ts 

import { Component, OnInit } from '@angular/core';
import { PaymentModalComponent } from './some-directory';

declare var $: any;

export class InvoicesComponent implements OnInit {
  paymentModal = new PaymentModalComponent();

  showPaymentModal(): void {
    alert('I am clicked in invoices');
    this.paymentModal.showModal();
  }
 }

и это второй компонент.ts 

declare var $: any;

export class PaymentModalComponent implements OnInit {

  showModal():void {
    alert('I am clicked in payment modal');
    $('#paymentModal').modal('show');
  }
 }

Вот как я называю модальное 

<button type="button" class="btn btn-success btn-sm mr-2"
 data-toggle="modal" data-target="#paymentModal (click)="showPaymentModal()">
                  Tender</button>

Оба alert() были вызваны. Но модал не показал. Стиль и сценарий были в нужном месте. Порядок сценария тоже правильный. Потому что я пытался разместить кнопку и модальный на одном компоненте, и он работает.

Некоторые могут сказать мне, чтобы использовать ngx-bootstrap, но я действительно хочу попытаться решить это.

...