角度，无法解析组件的所有参数

Question

Erros msg:

Error: Can't resolve all parameters for LoginCompComponent: ([object Object], [object Object], [object Object], [object Object], ?).
Evaluating src/main.ts
Booting application

The Component looks like this:

IMPORTS:

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import {MatSnackBar} from '@angular/material';
import { MatButtonModule, MatCheckboxModule } from '@angular/material';
import { OverlayReference } from './overlay-ref';

import { UsersService } from '../service/users.service';
import { OverlayService } from '../service/overlay.service';
import {TranslatePipe} from '../service/translate.pipe';
import {TranslationService} from '../service/translation.service';

CONSTRUCTOR:

  constructor(
    private router: Router,
    private usersService: UsersService,
    //private overlay: OverlayService,
    public translationService: TranslationService,
    public snackBar: MatSnackBar,
) {}

Miracle is, if you comment the overlay:OverlayService it will work perfectly, and if I uncomment this line it will die, with the error message in the beginning. Any thoughts?

Here is a StackBlitz link, if you want to see the whole thing.

Answer 1

You have a circular dependency between your TypeScript modules: OverlayService imports LoginComponent, and LoginComponent imports OverlayService.

Refactor the code to avoid that.

Answer 2

You import import { LoginCompComponent } from '../login-comp/login-comp.component' in OverlayService and you also import import { OverlayService } from '../service/overlay.service'; in LoginComponent .

Very very bad practise :) Need to refactor this