Bootstrap модал открывается на фоне (Angular)

Question

У меня есть модал, который я открываю из таблицы, что на вкладке материала

Вот модал HTML

    <div
    bsModal
    #createOrEditModal="bs-modal"
    class="modal fade"
    tabindex="-1"
    role="dialog"
    aria-labelledby="createOrEditModal"
    aria-hidden="true"

>
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <form
                *ngIf="active"
                #landlordPropertyPortfolioForm="ngForm"
                novalidate
                (ngSubmit)="saveWithReason()"
                autocomplete="off"
            >
                <div class="modal-header">
                    <h4 class="modal-title">
                        <span *ngIf="landlordPropertyPortfolio.id">{{ l("EditLandlordPropertyPortfolio") }}</span>
                        <span *ngIf="!landlordPropertyPortfolio.id">{{ l("CreateNewLandlordPropertyPortfolio") }}</span>
                    </h4>
                    <button type="button" class="close" (click)="close()" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                     <div *ngIf="!isNew" class="form-group">
                        <label for="LandlordPropertyPortfolio_Name">{{ l("Id") }}</label>
                        <input
                            type="text"
                            id="LandlordPropertyPortfolio_Id"
                            class="form-control"
                            [(ngModel)]="landlordPropertyPortfolio.id"
                            name="Id"
                            readonly
                        />
                    </div>
                    <div class="form-group">
                        <label for="LandlordPropertyPortfolio_Name">{{ l("Name") }}</label>
                        <input
                            type="text"
                            id="LandlordPropertyPortfolio_Name"
                            class="form-control"
                            [(ngModel)]="landlordPropertyPortfolio.name"
                            name="Name"
                            maxlength="0"
                            maxlength="255"
                            required
                        />
                    </div>
                </div>

                <div class="modal-footer">
                    <button [disabled]="saving" type="button" class="btn btn-default" (click)="close()">
                        {{ l("Cancel") }}
                    </button>
                    <button
                        type="submit"
                        class="btn btn-primary blue"
                        [disabled]="!landlordPropertyPortfolioForm.form.valid"
                        [buttonBusy]="saving"
                        [busyText]="l('SavingWithThreeDot')"
                    >
                        <i class="fa fa-save"></i> <span>{{ l("Save") }}</span>
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
<change-reason-modal
    #changeReasonModal
    [dtoModel]="landlordPropertyPortfolio"
    (save)="save()"
    (close)="onChangeReasonModalClose()"
>
</change-reason-modal>

Он открывается из компонента, где у меня есть вкладки

Вот код универсального c компонента, где у меня есть вкладки

 <div *ngIf="tabTemplates" class="row-fluid align-items-center margin-top-20 w-100">
                <mat-tab-group style="width: 100%;">
                    <mat-tab *ngFor="let tabTemplate of tabTemplates" label="{{ tabTemplate.title }}">
                        <ng-container *ngTemplateOutlet="tabTemplate.template"></ng-container>
                    </mat-tab>
                </mat-tab-group>
                <!-- <tabset class="tab-container tabbable-line">
                    <tab *ngFor="let tabTemplate of tabTemplates" heading="{{ tabTemplate.title }}"
                        customClass="m-tabs__item">
                        <ng-container *ngTemplateOutlet="tabTemplate.template"></ng-container>
                    </tab>
                </tabset> -->
            </div>

Я использовал angular вкладки материалов сейчас, когда я использовал tabset (код с комментариями), все было в порядке , теперь у меня есть это.

Я не могу щелкнуть модально, как я могу сделать это не фон?