使用Angular 2全局显示http错误

发布时间：2020-12-17 17:35:27 所属栏目：安全来源：网络整理

导读：我想为我的应用程序的所有页面显示全局http连接错误消息的弹出窗口. 有什么好办法吗？解决方法您可以通过包含此自定义组件来创建自定义组件并在弹出窗口中显示错误列表.例如,你可以这样做 @Component({ selector: 'list-errors',template: `ul class="erro

我想为我的应用程序的所有页面显示全局http连接错误消息的弹出窗口.

有什么好办法吗？

解决方法

您可以通过包含此自定义组件来创建自定义组件并在弹出窗口中显示错误列表.例如,你可以这样做

@Component({
     selector: 'list-errors',template: `<ul class="error-messages" *ngIf="errorList">
        <li *ngFor="let error of errorList">
            {{ error }}
        </li> </ul>`
    })
export class ListErrorsComponent {
  formattedErrors: Array<string> = [];

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

        if (errorList.errors) {
          for (let field in errorList.errors) {
            this.formattedErrors.push(`${field} ${errorList.errors[field]}`);
          }
        }
      };

      get errorList() { return this.formattedErrors; }
      }

在弹出窗口中使用此选项可以显示错误列表

<list-errors [errors]="errors"></list-errors>

创建一个错误模型

export class Errors {
  errors: {[key:string]: string} = {};
  }

设置错误对象的值并将此错误对象传递给list-error组件

errors: Errors = //assign your errors to this variable

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!