如何在 ngx-modal 中以编程方式关闭模态对话框

Question

我正在尝试创建一个登录对话框，该对话框应在成功登录后关闭

我已经创建了登录组件，这里是 html

    <modal #myModal submitButtonLabel="Login" (onSubmit)="onLogin()">
  <modal-header>
    <h1>Login</h1>
  </modal-header>
  <modal-content>
    <form>
      <div class="form-group">
        <label for="username">Username</label>
        <input type="text" class="form-control" id="username" placeholder="enter username"
               [(ngModel)]="user.username" name="username" required>
      </div>
      <div class="form-group">
        <label for="password">Password</label>
        <input type="password" class="form-control" id="password" placeholder="enter password"
               [(ngModel)]="user.password" name="password" required>
      </div>
      <hr/>
      <div class="form-group">
        <div class="row">
          <div class="col-md-1">
            <i class="fa fa-facebook-official"></i>
          </div>
          <div class="col-md-1">
            <i class="fa fa-google"></i>
          </div>
          <div class="col-md-1">
            <i class="fa fa-cc-visa"></i>
          </div>
        </div>
      </div>
    </form>
  </modal-content>
  <modal-footer>
    <button class="btn btn-primary" (click)="myModal.close()">close</button>
  </modal-footer>
</modal>

如何获取对 html 中定义的模态的引用，以便关闭模态对话框？

Answer 1

您使用 #myModal 和点击处理程序 myModal.close() 获取引用的方式应该可以正常工作。

您想在控制器中执行此操作吗？在这种情况下，您可以使用 @ViewChild('myModal') 装饰器。

如何在 ngx-modal 中以编程方式关闭模态对话框

How to close the modal dialog programmatically in ngx-modal

ngx-modal

angular