如何在新网址上的Angular中删除模式公开类？

Question

我有一个引导程序模态，在其中单击一个按钮会将其（存在模态的组件）路由到另一个组件（问题）。加载新组件时，modal-open类仍保留在body标记中，就会出现问题。有什么办法可以删除modal-body？另外，如果我单击返回上一页，该课程仍将保留在那里。

模式代码

<input type="submit" value="Submit" class="btn login-btn" [disabled]="profileForm.invalid" data-toggle="modal" data-target="#instructions">
<div class="modal fade" id="instructions" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalScrollableTitle">Instructions</h5>
            </div>
            <div class="modal-body">
                content written here
                <form action="">
                    <div class="form-row align-items-center">
                        <div class="col-auto my-1">
                            <div class="custom-control custom-checkbox mr-sm-2">
                                <input type="checkbox" class="custom-control-input" id="customControlAutosizing">
                                <label class="custom-control-label" for="customControlAutosizing">
                                    To start, click the "Start" button. When finished, click the "Submit Quiz" button.
                                </label>
                            </div>
                        </div>
                        <div class="col-auto my-1">
                            <button type="submit" class="btn btn-primary" [routerLink]="['/questions']">Submit</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

我写了这个CSS来覆盖主要的CSS，但是没有用：

.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    transform: translate(0, -25%);
  }

而且我还尝试从fade分区中删除modal类。>

我有一个引导程序模态，在其中单击一个按钮会将其（存在模态的组件）路由到另一个组件（问题）。当新的...

Answer 1

U可以给您的按钮提供点击事件