如何解决 TypeScript 编译器错误 TS2339：属性 'errorValue' 在我的 Angular 5 应用程序中的类型 {} 上不存在

Question

我在组件中编写了一个函数来处理从 Rest 服务返回错误并确定应向用户显示什么错误消息，该方法采用错误对象（这是具有特定结构的自定义数据来自 rest 服务）作为参数，播种 drills 以查找相关内容，然后使用 switch 语句发送一个 JSON 键，该键被 i18n 服务使用，它在下面（我知道这不是最好的)

private myErrorHandler(err: any): string {
    // Why doesn't typescript support null-conditional?
    if (err.error && err.error.errors && err.error.errors[0] && err.error.errors[0].error) {
      const errorMsg = err.error.errors[0].error;
      const errorValue = err.error.errors[0].value;
      const translationArgs: any = {errorValue: null};
      let correctMsg;

      if (errorValue) {
        translationArgs.errorValue = errorValue; // this line gives me the TypeScript compiler error TS2339: Property 'errorValue' does not exist on type {}
      }

      switch (errorMsg) {
        case 'not_unique': {
          correctMsg = errorValue ? 'common.validation.not_unique_value' : 'common.validation.not_unique';
          break;
        }
        default: {
          correctMsg = 'common.messages.global_error';
          break;
        }
      }
      return this.localizationService.translate(correctMsg, translationArgs as any);
    }
    return this.localizationService.translate('common.messages.global_error');
  }

我的问题是有时我希望将一些返回的错误数据作为参数插入到返回的消息中，上面的方法允许我这样做但是我设置它的方式，就像这样，引发了一个 TypeScript 编译器错误：

if (errorValue) {
            translationArgs.errorValue = errorValue;
}

如何防止此 linting 错误？我想通过给对象 const translationArgs 一个 errorValue 属性并将其分配给 null 就足够了......但我错了。如有任何建议，我们将不胜感激。

我也知道这个方法/函数有点难看，所以对它的任何评论也很感激。

（按要求）这是我的 tsconfig 文件的内容

{
  "compilerOptions": {
    "alwaysStrict": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "es6",
      "dom"
    ],
    "module": "commonjs",
    "moduleResolution": "node",
    "noFallthroughCasesInSwitch": true,
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "outDir": "dist",
    "pretty": true,
    "sourceRoot": "frontend",
    "rootDir": "frontend",
    "sourceMap": true,
    "target": "es5",
    "types": [
      "node",
      "mocha",
      "chai",
      "chai-as-promised",
      "aws-sdk",
      "q",
      "sinon",
      "file-saver"
    ],
    "typeRoots": [
      "./node_modules/@types"
    ]
  },
  "include": [
    "frontend/**/*.ts"
  ],
  "exclude": [
    ".git",
    ".idea",
    "config",
    "dist",
    "e2e_tests",
    "gulp",
    "node_modules",
    "reports",
    "server",
    "typings/browser.d.ts"
  ],
  "awesomeTypescriptLoaderOptions": {
    "useWebpackText": true
  },
  "angularCompilerOptions": {
    "debug": false
  },
  "compileOnSave": false,
  "buildOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

Answer 1

不是一个绝妙的解决方案，但您总能做到

(translationArgs as any).errorValue = errorValue;

或提供比 any 更好的类型，但不是 {}。

Answer 2

我对你的 tslint 配置没有任何问题。这里是小重构版本。

myErrorHandler(err: any): string {

  let error: any;
  try {
    error = err.error.errors[0];
  } catch (e) {
    return this.localizationService.translate('common.messages.global_error');
  }

  const errorMsg = error.error;
  const errorValue = error.value;
  const translationArgs = {errorValue: null};
  let correctMsg;

  if (errorValue) {
    translationArgs.errorValue = errorValue;
  }

  switch (errorMsg) {
    case 'not_unique': {
      correctMsg = errorValue ? 'common.validation.not_unique_value' : 'common.validation.not_unique';
      break;
    }
    default: {
      correctMsg = 'common.messages.global_error';
      break;
    }
  }
  return this.localizationService.translate(correctMsg, translationArgs as any);

}

如何解决 TypeScript 编译器错误 TS2339：属性 'errorValue' 在我的 Angular 5 应用程序中的类型 {} 上不存在

How to resolve TypeScript compiler error TS2339: Property 'errorValue' does not exist on type {} in my Angular 5 application

angular

typescript

tslint