Question

我正在尝试使用新的babel 7转换我的angular 6项目（用打字稿编写），但是我不知道如何使依赖注入起作用。

每次在chrome中启动项目时，都会引发以下错误：

Uncaught Error: Can't resolve all parameters for AppComponent: (?).
at syntaxError (compiler.js:1270)
at CompileMetadataResolver._getDependenciesMetadata (compiler.js:11171)
at CompileMetadataResolver._getTypeMetadata (compiler.js:11064)
at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:10683)
at CompileMetadataResolver._getEntryComponentMetadata (compiler.js:11267)
at eval (compiler.js:10927)
at Array.map (<anonymous>)
at CompileMetadataResolver.getNgModuleMetadata (compiler.js:10927)
at JitCompiler._loadModules (compiler.js:24104)
at JitCompiler._compileModuleAndComponents (compiler.js:24085)

我创建了样板的叉子，并添加了一个简单的httpClient服务注入来重现该错误： https://github.com/gnihi/angular-6-with-babel-typescript

如果您在app.component.ts中删除了构造函数，那么一切都会很好。

这是项目依赖项：

{
"devDependencies": {
    "@babel/core": "^7.1.2",
    "@babel/plugin-proposal-class-properties": "^7.1.0",
    "@babel/plugin-proposal-decorators": "^7.1.2",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-typescript": "^7.1.0",
    "babel-loader": "^8.0.0",
    "babel-plugin-transform-decorators": "^6.24.1",
    "webpack": "^4.17.1",
    "webpack-cli": "^3.1.0",
    "webpack-dev-server": "^3.1.7"
},
"scripts": {
    "build:dev": "webpack --mode development",
    "build:prod": "webpack --mode production",
    "dev": "webpack-dev-server --mode development --content-base=./dist/",
    "type-check": "tsc"
},
"dependencies": {
    "@angular/common": "^6.1.6",
    "@angular/compiler": "^6.1.6",
    "@angular/core": "^6.1.6",
    "@angular/platform-browser-dynamic": "^6.1.6",
    "@angular/platform-browser": "^6.1.6",
    "core-js": "^2.5.7",
    "zone.js": "^0.8.26"
}
}

感谢您的时间和帮助！

Answer 1

初始存储库的所有者回答了我的问题（https://github.com/hzub/angular-6-with-babel-typescript/issues/2#event-1919783976）。似乎依赖关系无法在应用程序中解决。他建议切换为利用依赖项注入（angular.core.Inject）。 https://blog.thoughtram.io/angular/2015/05/09/writing-angular-2-code-in-es5.html。

babel移植的项目中的角度依赖注入

1 个答案: