typescript2.0 - TypeScript 错误 TS2339，但属性确实存在

Question

当我使用 gulp 编译以下 TypeScript 代码时，我得到:错误 TS2339:类型“Response”上不存在属性“accessToken”。 Visual Studio 2015 中的 ErrorList 窗口针对 data.accessToken 和 data.expiryDate 报告相同的错误。当我注释掉引用变量 data 的两行时，代码运行并且调试器显示 data 不是“Response”类型，并且实际上包含属性data.accessToken 和 data.expiryDate。在 Visual Studio 中，当我将鼠标悬停在 data 变量上时，工具提示会正确报告 data 的类型为 any。

为什么 TypeScript 无法正确转译这个问题以及如何解决这个问题？为什么 TypeScript 认为 data 是 Response 类型，而不是 any 类型？我正在使用 TypeScript 2.1.4。 http.fetch 正在使用 aurelia 获取客户端 documented here

/// <reference path="../typings/index.d.ts" />
import 'fetch';
import {HttpClient, json} from 'aurelia-fetch-client';
import {inject} from 'aurelia-framework';
import {BearerToken} from './common/bearer-token';
export class ApiToken
{
...
    public refreshToken(): Promise<BearerToken>
    {
        let token: BearerToken = new BearerToken();
        token.accessToken = "no_data";
        token.expiryDate = Date.now();

        return this.http.fetch('/Account/getToken')
            .then(response => response.json())
            .then(data =>
            {                
                console.log('ApiToken.refreshToken returned data: ' + data);

                // The next two lines cause build errors. 
                // When commented out the code runs and the debugger shows that
                // data.accessToken and data.expiryDate do exist on data.
                token.accessToken = data.accessToken;
                token.expiryDate = data.expiryDate;           

                return token;
            })
            .then((t) => { return this.saveToken(t) });
    }
...
}

这是我的 tsconfig.json 文件:

{
  "compileOnSave": false,
  "compilerOptions": {
    "rootDir": "src",
    "outDir": "dist",
    "sourceMap": true,
    "target": "es5",
    "module": "amd",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "lib": ["es2015", "dom"],
    "baseUrl": "./",
    "paths": {
      "src/*": ["src/*"]
    }
  },
  "filesGlob": [
    "./src/**/*.ts",
    "./test/**/*.ts",
    "./typings/index.d.ts",
    "./custom_typings/**/*.d.ts",
    "./jspm_packages/**/*.d.ts"
  ],
  "exclude": [
    "node_modules",
    "jspm_packages",
    "dist",
    "build",
    "test"

  ],
  "atom": {
    "rewriteTsconfig": false
  }
}

我尝试使用以下内容指定数据的类型，但它没有解决问题，尽管错误消息不同，如下所示:

interface TokenResult
{
    accessToken: string;
    expiryDate: string;
}    

....

public refreshToken(): Promise<BearerToken>
{
    let token: BearerToken = new BearerToken();
    token.accessToken = "no_data";
    token.expiryDate = new Date(Date.now().toString());

    return this.http.fetch('/Account/getToken')
        .then(response => response.json())
        .then((data: TokenResult) =>
        {                
            console.log('ApiToken.refreshToken returned data: ' + data);

            token.accessToken = data.accessToken;
            token.expiryDate = new Date(data.expiryDate); 

            return token;
        })
        .then((t) => { return this.saveToken(t) });
}

错误是:

error TS2345: Argument of type '(data: TokenResult) => BearerToken' is not assignable to parameter of type '(value: Response) => BearerToken | PromiseLike<BearerToken>'.
  Types of parameters 'data' and 'value' are incompatible.
    Type 'Response' is not assignable to type 'TokenResult'.
      Property 'accessToken' is missing in type 'Response'.

Answer 1

我从 gitter 的贡献者那里找到了答案。强制转换为 any，然后强制转换为 TokenResult 就成功了，如下所示...

return this.http.fetch('/Account/getToken')
    .then(response => response.json())
    .then((data: any) =>
    {
        console.log('ApiToken.refreshToken returned data: ' + data);

        token.accessToken = (<TokenResult>data).accessToken;
        token.expiryDate = (<TokenResult>data).expiryDate;

        return token;
    })
    .then((t) => { return this.saveToken(t) });