未捕获的错误:无法解析EventsComponent(角度)的所有参数

时间:2018-10-26 11:47:26

标签: angular typescript angular2-services

有人能弄清楚为什么不能将我的EventService注入到我的EventsComponent中吗? 我在chrome控制台中收到此错误: Uncaught Error: Can't resolve all parameters for EventsComponent: (?, ?).

https://github.com/andrelin/ng-fundamentals

我尝试使用谷歌搜索,并在StackOverflow上查看了几个不同的答案,但是一切似乎都是正确的。有人建议在项目中某处可能存在循环依赖关系,但我确实找不到任何循环依赖关系。有人对此有建议吗?

我的(简化的)AppModule:

import { EventService } from './events/services/event.service';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { EventsComponent } from './events/events.component';

@NgModule({
  declarations: [AppComponent, EventsComponent],
  imports: [BrowserModule, AppRoutingModule],
  providers: [EventService],
  bootstrap: [AppComponent]
})
export class AppModule {}

我的EventComponent:

import { Component, OnInit } from '@angular/core';
import { EventService } from './services/event.service';

@Component({
  selector: 'app-events',
  templateUrl: './events.component.html',
  styleUrls: ['./events.component.css']
})
export class EventsComponent implements OnInit {
  events: any[];

  constructor(private eventService: EventService) {}

  ngOnInit() {
    this.events = this.eventService.getEvents();
  }
}

我的EventService

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class EventService {
  constructor() {}

  getEvents() {
    return EVENTS;
  }
}

示例事件数组

const EVENTS = [
  {
    id: 1,
    name: 'Angular Connect',
    date: '9/26/2020',
    time: '8:00 am',
    price: 599.99,
    imageUrl: '/assets/images/angualrconnect-shield.png',
    location: {
      address: '1057 DT',
      city: 'London',
      country: 'England'
    }
  },
  {
    id: 2,
    name: 'Angular Netherlands',
    date: '10/10/2021',
    time: '10:00 am',
    price: 60,
    imageUrl: '/assets/images/ng-nl.png',
    location: {
      address: 'A very long address just to make this two lines!',
      city: 'Amsterdam',
      country: 'Netherlands'
    }
  }
];

3 个答案:

答案 0 :(得分:1)

我不知道为什么,但是将这行import 'core-js/es7/reflect';添加到main.ts的顶部为我解决了这个问题。 检查this page,从angular-cli的demo获得了此解决方案。

答案 1 :(得分:0)

请尝试从提供商数组 app.module.ts 中删除EventService或从 .service.ts 中删除providedIn

答案 2 :(得分:0)

我发现并在tsconfig.json中添加了“ emitDecoratorMetadata”:true

{
  "extends": "../tsconfig.app.json",
  "compilerOptions": {
    "types": [
      "node"
    ],
    "emitDecoratorMetadata": true
  },