[ng-bootstrap]：调用api后打开模态，ExpressionChangedAfterItHasBeenCheckedError

Question

我正在使用Angular，express（节点）。 我在登录时验证用户的数据（httpClient - express）后打开一个模态。 但是当我打开模态时（是的，模态打开）我在控制台中得到一个异常：

ExpressionChangedAfterItHasBeenCheckedError: 
Expression has changed after it was checked. Previous value: 
'ng-untouched: true'. Current value: 'ng-untouched: false'.

这是我的基本代码： example.html的

<ng-template #modalexample let-c="close" let-d="dismiss">
/** modal body **/
  </ng-template>

form (ngSubmit)="f.form.valid && signin()" #f="ngForm" class="m-login__form m-form" action="">
                        <ng-template #alertSignin></ng-template>
                        <div class="form-group m-form__group">
                            <input class="form-control m-input" type="text" placeholder="Email" name="email" [(ngModel)]="model.email" #email="ngModel" autocomplete="off">
                        </div>
                        <div class="form-group m-form__group">
                            <input class="form-control m-input m-login__form-input--last" type="password" placeholder="Password" name="password" [(ngModel)]="model.password" #password="ngModel">
                        </div>
                        <div class="row m-login__form-sub">
                            <div class="col m--align-left">
                                <label class="m-checkbox m-checkbox--focus">
                                    <input type="checkbox" name="remember" [(ngModel)]="model.remember" #remember="ngModel">
                                    Remember me
                                    <span></span>
                                </label>
                            </div>
                            <div class="col m--align-right">
                                <a href="javascript:;" id="m_login_forget_password" class="m-link">
                                    Forget Password ?
                                </a>
                            </div>
                        </div>
                        <div class="m-login__form-action">
                            <button [disabled]="loading" [ngClass]="{'m-loader m-loader--right m-loader--light': loading}" id="m_login_signin_submit" class="btn btn-focus m-btn m-btn--pill m-btn--custom m-btn--air">
                                Sign In
                            </button>
                        </div>
                    </form>

我的component.ts

@ViewChild('modalexample', {read: TemplateRef}) modal: TemplateRef<any>;

  signin() {
console.log("Signin")
this.modalService.open(this.content);
this.loading=true;
this._authUser.login(this.model.email, this.model.password).subscribe(
  response=>{
    if(!response.error){
      this.loading=false;
    }
    else{
      alert('Error');
    }
    this.loading=false;
  },
  error=>{
    console.log(error)
    this.loading=false;
  }
)
}

我该如何解决？ 谢谢：D