Question

我已经在app.module.ts中注册了此组件：

    import { Component } from '@angular/core';
import { MessageService } from 'primeng/api';

@Component({
  selector: 'app-modal',
  templateUrl: './modal.component.html',
  styleUrls: ['./modal.component.css'],
  providers: [MessageService]
})

export class ModalComponent {

  constructor(
    private messageService: MessageService
  ) { }

  onConfirm() {
  }

  showError(error) {
  }

}

但是我不能将此组件包含在另一个组件中。我收到此错误：

错误错误：未捕获（承诺）：错误：StaticInjectorError（AppModule）[TopbarComponent-> ModalComponent]： StaticInjectorError（平台：核心）[TopbarComponent-> ModalComponent]：

这是我的TopbarComponent：

import { Component } from '@angular/core';
import { SessionStorageService } from 'angular-web-storage';
import { Router } from "@angular/router"
import { AppComponent } from '../app.component';
import { ModalComponent } from '../modal/modal.component';
import { HomeComponent } from '../home/home.component';
import { JhttpService } from '../jhttp.service';

@Component({
  selector: 'app-topbar',
  templateUrl: './topbar.component.html'
})

export class TopbarComponent {

  user = this.session.get('USER');

  constructor(
    private jhttpService: JhttpService,
    private session: SessionStorageService,
    private router: Router,
    private glob: AppComponent,
    private modal: ModalComponent,
    private app: HomeComponent
  ) { }

  onLogoutButtonClick(event) {
    this.modal.showError('CIAO');
    event.preventDefault();
  }
}

任何建议？

Answer 1

从构造函数注入中删除组件。

import { Component } from '@angular/core';
import { SessionStorageService } from 'angular-web-storage';
import { Router } from "@angular/router"
import { AppComponent } from '../app.component';
import { ModalComponent } from '../modal/modal.component';
import { HomeComponent } from '../home/home.component';
import { JhttpService } from '../jhttp.service';

@Component({
  selector: 'app-topbar',
  templateUrl: './topbar.component.html'
})

export class TopbarComponent {

  user = this.session.get('USER');

  constructor(
    private jhttpService: JhttpService,
    private session: SessionStorageService,
    private router: Router
  ) { }

  onLogoutButtonClick(event) {
    this.modal.showError('CIAO');
    event.preventDefault();
  }
}

Answer 2

不要在构造函数中添加组件。另外，请确保另一个ModalComponent必须是正在使用的模块的一部分。在使用模块的模块中导入“ ModalComponent”模块，或者将ModalComponent添加到使用模块的declaration数组中。

Angular 7：包含组件存在问题

2 个答案: