Question

我正在使用Angular 6.x创建登录页面。我已经使用HTTP错误拦截器捕获了所有HTTP问题。这是我的错误拦截器和app.module的样子

``` 从“ @ angular / core”导入{可注射}；从'@ angular / common / http'导入{HttpEvent，HttpInterceptor，HttpHandler，HttpRequest，HttpErrorResponse，HTTP_INTERCEPTORS}；从'rxjs'导入{Observable，throwError}; 从'rxjs / operators'导入{catchError};

/**
 * Intercepts the HTTP responses, and in case that an error/exception is thrown, handles it
 * and extract the relevant information of it.
 */
@Injectable()
export class ErrorInterceptor implements HttpInterceptor {
    /**
     * Intercepts an outgoing HTTP request, executes it and handles any error that could be triggered in execution.
     * @see HttpInterceptor
     * @param req the outgoing HTTP request
     * @param next a HTTP request handler
     */
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        return next.handle(req).pipe(
            catchError(errorResponse => {
                let errMsg: string;
                if (errorResponse instanceof HttpErrorResponse) {
                    const err = errorResponse.message || JSON.stringify(errorResponse.error);
                    errMsg = `${errorResponse.status} - ${errorResponse.statusText || ''} Details: ${err}`;
                } else {
                    errMsg = errorResponse.message ? errorResponse.message : errorResponse.toString();
                }
                console.log(errMsg)
                return throwError(errorResponse);
            }));
    }
}

/**
 * Provider POJO for the interceptor
 */
export const ErrorInterceptorProvider = {
    provide: HTTP_INTERCEPTORS,
    useClass: ErrorInterceptor,
    multi: true,
};

```

我已经在app.module.ts中添加了相同内容

```

providers: [
    DataService,
    DatePipe,
    ErrorInterceptorProvider,
    DataBaseService,
],

```

当我执行失败的登录调用时，错误将被正确捕获，然后我将返回组件中的错误处理程序

```

login(args: EventData) {
    ..... Some code

    //call login service
    this.service.login(this.user).subscribe((result) => {
        console.log("token: ", result.token);

        .... Some code on success

    }, (error) => {
        this.processing = false;
        this.isError = true;
        loginBtn.isEnabled = true;
        switch (error.status.toString()) {
            case "401":
                lbl.text = localize("invalid_user_pass");
                break;
            case "200":
                lbl.text = localize("server_error");
                break;
            default:
                lbl.text = localize("invalid_user_pass");
                break;
        }
        this.cleanUser();
    });
}

```

问题是，即使我正在更新组件中的变量，我的视图也无法反映这些更改。我发现similar链接存在非常相似的问题。 NgZone。我觉得即使我也面临类似的问题，但目前无法获得解决方案。我试图通过错误拦截方法中的ngZone返回值。但是问题没有解决。有人可以帮助确定根本原因吗？由于此问题似乎纯粹是与Angular相关的问题，因此请标记Angularjs和Nativescript标签。

检测到Http响应，但未使用Angular 6.x更新视图

0 个答案: