angular - 在 Angular 和 Ng-Bootstrap 中清除 NgbModal 状态

Question

成功更新后如何清除模态？当更新出现错误时，我会在模式上显示错误。我只是在成功更新后进行form.reset。this.modalReference.close()我想知道如何清除状态，以便当我再次打开模式时，错误将不再存在。

组件.ts

updateUser() {....
    if (result.value) {
              ......subscribe(() => {
                  form.reset();
                  this.modalReference.close();
              }, err => {
                console.log(err);
                this.errors = err.error;
              });
            }
}

组件.html

<app-error [errors]="errors"></app-error>
<tr>.....

error.component.ts

export class ErrorsComponent {
      formattedErrors: Array<string> = [];

      @Input()
      set errors(errorList: Errors) {
        this.formattedErrors = [];

        if (errorList.errors) {
          for (const field of Object.keys(errorList.errors)) {
            this.formattedErrors.push(`${field} ${errorList.errors[field]}`);
          }
        }
      };

      get errorList() { return this.formattedErrors; }

    }

标签： angularangular6angular7ng-bootstrap

Answer 1

我认为你弄错了@Input 装饰器。@Input 装饰器用于从父组件获取数据/输入。就是这样。

// child.component.ts

@Input()
errors: string[];

// parent.component.ts
<child [errors]="my error varialbe in parent component"></child>

你检查这个 stackblitz 基本示例。