Angular 5 HTTP调用报错：未类型化函数调用不可接受类型参数

你遇到的这个类型识别报错，通常和TypeScript版本兼容性、代码写法或者编辑器配置有关，我来帮你一步步排查解决：

可能的原因及解决方案 #

1. 先检查TypeScript版本兼容性 #

Angular 4.3.x对TypeScript版本有明确要求（需要2.3.x至2.4.x区间的版本），如果项目使用的TypeScript版本过低，就会出现泛型函数调用的语法报错：

• 查看当前TypeScript版本：在项目根目录终端运行 tsc -v
• 安装兼容版本：如果版本不符，执行 npm install typescript@2.4.2 --save-dev

2. 用类型断言替代泛型调用（最稳妥的临时方案） #

旧版本TypeScript对HttpClient的泛型支持不够完善，你可以通过map操作符结合类型断言来明确返回类型，避开这个报错：

getHomeDetails(): Observable<ITemp> {
  return this.http.get(this.baseUrl)
    .map(response => response as ITemp); // 通过类型断言指定返回类型为ITemp
}

你已经导入了'rxjs/Rx'，这会包含所有RxJS操作符，所以map可以直接使用。

3. 调整Observable的导入路径 #

有时候导入路径不正确会导致类型不匹配，尝试把Observable的导入从：

import { Observable } from "rxjs/Observable";

改为：

import { Observable } from "rxjs";

这会导入完整的Observable类型，和HttpClient返回的Observable更匹配。

4. 修正编辑器的TypeScript版本配置 #

Sublime和Visual Studio默认可能使用全局TypeScript版本，而非项目本地的，这会导致编辑器报错但项目能正常编译：

• Visual Studio：在项目根目录的tsconfig.json中添加配置，指定使用项目本地的TypeSDK：

  {
    "compilerOptions": {
      "tsdk": "./node_modules/typescript/lib"
    }
  }
  

• Sublime Text：安装TypeScript插件后，通过Preferences > Package Settings > TypeScript > Settings - User设置本地TypeScript路径：

  {
    "typescript_tsdk": "/你的项目路径/node_modules/typescript/lib"
  }
  

5. 检查tsconfig.json的编译选项 #

确保编译配置支持泛型语法，可暂时调整严格模式排查问题：

{
  "compilerOptions": {
    "target": "es6",
    "lib": ["es2015", "dom"],
    "noImplicitAny": false,
    "strictNullChecks": false
  }
}

验证方法 #

修改后重启编辑器（或VS的TypeScript服务），再检查getHomeDetails方法的类型提示，接口ITemp应该就能被正确识别了。

内容的提问来源于stack exchange，提问作者nishil bhave