【问题标题】:Angular http get not working and no error thrownAngular http 无法正常工作并且没有抛出错误
【发布时间】:2017-04-10 15:53:58
【问题描述】:

关于这个主题有很多问题,但我找不到合适的解决方案。我在控制台上看不到任何错误,这就是它非常令人困惑的原因。

这是我的服务文件代码

   findVariantById(id: string):Observable<Evaluation[]>  {

    const endPoint = 'Evalution/Get'
    let params = new URLSearchParams();
    params.set('key', '1234'); //For example API key would come into picture
    params.set('id', id);
    params.set('format', 'json');
    params.set('callback', 'JSONP_CALLBACK');
    // this much code gets called but nothing on Network tab. 
    return this.http.get(this.apiUrl + endPoint, { search: params })
         .map<Evaluation[]>(this.extractData)
        .catch<Evaluation[]>(this.handleError);
} 

这是我调用服务的组件文件代码

    evaluation(id: string) {
        this.searchService.findVariantById(id)
            .subscribe(
            evaluations => this.evaluations = evaluations,
            error => this.errorMessage = <any>error);
    }        

和模型

  export interface Evaluation {
    QuestionId: string;
    QuestionText: string;
    questionResponse: Array<Object>
  }

我已经包含了相应的依赖项

   import { Observable } from 'rxjs/Observable';
   import 'rxjs/add/operator/map';
   import 'rxjs/add/operator/catch';
    import 'rxjs/add/operator/toPromise';

我正在使用“@angular/core”:“~2.2.1”和“rxjs”:“5.0.0-beta.12”。 任何形式的帮助都将受到高度赞赏。谢谢

更新:切换到 Angular:4.0.1 后,Http.Get 和 Post 报错为

提供的参数与调用目标的任何签名都不匹配。

所以我做了以下更改。它工作得很好。

  return this.http.get(this.apiUrl + endPoint, { search: params })
        .map(this.extractData)
        .catch(this.handleError); 

【问题讨论】:

  • 你能补充一下你面临的问题吗?
  • 您是否看到发出了网络请求(在 devtools 网络选项卡中)?
  • 我无法在“网络”选项卡上看到请求。它就像一个幽灵请求。问题是我无法在我的 angular2 网站上执行任何 HTTP 获取。并且在控制台上看不到错误。

标签: angular typescript angular-http


【解决方案1】:

此错误是由于模拟 HTTP 请求的假后端提供程序造成的。

我使用 Fake Backend Provider 来执行登录和注册,按照以下教程。
更多信息:http://jasonwatmore.com/post/2016/09/29/angular-2-user-registration-and-login-example-tutorial

通过从app.module.ts 中删除它的依赖关系,它解决了我的问题。

【讨论】:

  • 感谢您的提示 - 我一直在为此绞尽脑汁,直到您的简单提示提醒我,我也有一个模拟数据库。
猜你喜欢
  • 2015-03-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-06-21
  • 2019-10-17
  • 2013-10-14
  • 2014-01-17
相关资源
最近更新 更多