Angular 6 – 无法解析AppComponent的所有参数

前端之家收集整理的这篇文章主要介绍了Angular 6 – 无法解析AppComponent的所有参数前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试使用Angular 6构建一个应用程序,我仍在设置所有内容.但似乎我的应用程序中的依赖注入有问题.

它无法解析任何构造函数参数.它们都导致未捕获错误:无法解析AppComponent的所有参数:(?)..即使自定义服务也会导致相同的错误.

版本(省略了对此不会产生任何影响的依赖项)

  1. "dependencies": {
  2. "@angular/common": "6.0.5","@angular/compiler": "6.0.5","@angular/core": "6.0.5","@angular/forms": "6.0.5","@angular/http": "6.0.5","@angular/platform-browser": "6.0.5","@angular/platform-browser-dynamic": "6.0.5","@angular/router": "6.0.5","core-js": "2.5.7","reflect-Metadata": "0.1.12","rxjs": "6.2.1","zone.js": "0.8.26"
  3. },"devDependencies": {
  4. "@angular/compiler-cli": "6.0.5","@ngtools/webpack": "6.0.8","angular2-template-loader": "0.6.2","awesome-typescript-loader": "5.1.0","typescript": "2.7.2","webpack": "4.12.0","webpack-cli": "3.0.8","webpack-dev-server": "3.1.4",}

app.module.ts

  1. @NgModule({
  2. declarations: [
  3. AppComponent
  4. ],imports: [
  5. BrowserModule
  6. ],providers: [],bootstrap: [AppComponent]
  7. })
  8. export class AppModule {
  9. }

TestService.ts

  1. import {Injectable} from "@angular/core";
  2.  
  3. @Injectable({
  4. providedIn: 'root'
  5. })
  6. export class TestService {
  7.  
  8. constructor() {
  9. console.warn("It works!");
  10. }
  11.  
  12. public sayHello(): string {
  13. return "hello world!";
  14. }
  15. }

App.component.ts

  1. import {Component} from '@angular/core';
  2. import {TestService} from "./TestService";
  3.  
  4. @Component({
  5. selector: 'sh-home',styleUrls: ['./home.scss'],templateUrl: './home.html'
  6. })
  7. export class HomeComponent {
  8.  
  9. constructor(testService: TestService) {
  10. testService.sayHello();
  11. }
  12. }

在这种情况下,TestService的注入给出了错误

Main.ts

  1. import {enableProdMode} from '@angular/core';
  2. import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
  3.  
  4. import {AppModule} from './app/app.module';
  5. import './assets/scss/styles.global.scss'; // Import the global scss files
  6.  
  7. // Polyfills
  8. import './Polyfills';
  9.  
  10. if (process.env.NODE_ENV === 'production') {
  11. enableProdMode();
  12. }
  13.  
  14. platformBrowserDynamic().bootstrapModule(AppModule);

Polyfills.ts

  1. /** IE9,IE10 and IE11 requires all of the following polyfills. **/
  2. import 'core-js/es6/symbol';
  3. import 'core-js/es6/object';
  4. import 'core-js/es6/function';
  5. import 'core-js/es6/parse-int';
  6. import 'core-js/es6/parse-float';
  7. import 'core-js/es6/number';
  8. import 'core-js/es6/math';
  9. import 'core-js/es6/string';
  10. import 'core-js/es6/date';
  11. import 'core-js/es6/array';
  12. import 'core-js/es6/regexp';
  13. import 'core-js/es6/map';
  14. import 'core-js/es6/weak-map';
  15. import 'core-js/es6/set';
  16.  
  17. /** IE10 and IE11 requires the following for NgClass support on SVG elements */
  18. import 'classlist.js'; // Run `npm install --save classlist.js`.
  19.  
  20. /** IE10 and IE11 requires the following for the Reflect API. */
  21. import 'core-js/es6/reflect';
  22.  
  23.  
  24. /** Evergreen browsers require these. **/
  25. // Used for reflect-Metadata in JIT. If you use AOT (and only Angular decorators),you can remove.
  26. import 'core-js/es7/reflect';
  27.  
  28. /***************************************************************************************************
  29. * Zone JS is required by default for Angular itself.
  30. */
  31. import 'zone.js/dist/zone'; // Included with Angular CLI.

我没有使用CLI,而是使用自定义启动器.我包括所有与Angular-CLI相同的polyfill,所以我没有错过任何.

有谁看到我做错了什么?

更新

我简化了测试用例并注意到它不是翻译模块.即使我创建一个简单的服务,我也不能使用依赖注入.将服务添加到提供者列表也不起作用(也不应该是必需的,因为我使用的是Angular 6’adminIn:root’).

确保在polyfill中进行以下导入

import’core-js / es7 / reflect’;

猜你在找的Angularjs相关文章