角度 EventEmitter 错误：期望 0 个类型参数，但得到了 1

Question

我是一名有用的助手，可以为你翻译文本。

我遵循这个教程，但仍然出现了类型错误：“期望 0 个类型参数，但得到了 1 个”。 https://youtu.be/I317BhehZKM?t=57s

我已经指定了：

  newUserInfoComplete:boolean = false

但是在这一行中，<boolean> 出现了上述错误：

  @Output() newUserInfoCompleteEvent = new EventEmitter <boolean> ();

此外，如果我简单地省略<boolean>，就会出现以下错误：

Argument of type 'boolean' is not assignable to parameter of type 'string'.

这里下划线标出了 this.NewUserInfoComplete：

this.newUserInfoCompleteEvent.emit(this.newUserInfoComplete);

这是我的组件：

import { Component, OnInit, Output } from '@angular/core';
import { slideToRight } from '../../../../router.animations';
import { Router, ActivatedRoute, UrlSegment } from '@angular/router';
import { EventEmitter } from 'protractor';

@Component({
  selector: 'app-new-user-input',
  templateUrl: './new-user-input.component.html',
  styleUrls: ['./new-user-input.component.css'],
  animations: [slideToRight()]
})
export class NewUserInputComponent implements OnInit {

  newUserInfoComplete:boolean = false

  @Output() newUserInfoCompleteEvent = new EventEmitter <boolean> ();

  constructor(private router: Router, r: ActivatedRoute) {
    r.url.subscribe((s: UrlSegment[]) => {
      console.log("url", s); //https://vsavkin.com/angular-router-understanding-router-state-7b5b95a12eab
    });
  }

  ngOnInit() {
  }



  sendNewUserInfoComplete(){
    this.newUserInfoCompleteEvent.emit(this.newUserInfoComplete);
  }


  displaySibling() {
    console.log(this.router);
    this.router.navigate(['../', { outlets: { newuserorginfo: ['newuserorginfo'] } }])
  }

  closeBlade() {
    this.router.navigate([{ outlets: { newuserinput: null } }]);
  }

}

- imnickvaughn

---

温馨提示：请不要再添加只是说“从Angular导入而不是其他路径”的答案了。顶部的答案已经提到了这一点。 - General Grievance

Answer 1

尝试从@angular/core中导入EventEmitter而不是从protractor中导入：

import { Component, OnInit, Output, EventEmitter } from '@angular/core';

- ConnorsFan

---

默认情况下，它从“Events”中导入EventEmitter。确保查看其导入自何处。 - tony2tones

我的导入是：import { EventEmitter } from 'events'。将其改成@angular/core即可解决问题。 - CFNinja

是的，我正在使用VS Code，但不确定为什么它从错误的位置自动导入。这绝对是我的问题。 - Callat

VS Code 仍然会从 Protractor 自动导入，这个答案也解决了我的问题。谢谢。 - static_null

VS Code可以自动从stream导入。 - Ali Al Amine

Answer 2

245

从 Angular 中导入 EventEmitter，而不是从 stream 中导入：

import { Component, OnInit, Output, EventEmitter } from '@angular/core';

不要这样做

import { EventEmitter } from 'stream'; “>”

- Sonali Mangrinda

Answer 3

我忘记检查我的导入了！该死。我使用的是PROTRACTOR的事件发射器，而不是angular核心Event Emitter。

import { EventEmitter } from '@angular/core';
import { Component, OnInit, Output } from '@angular/core';
import { slideToRight } from '../../../../router.animations';
import { Router, ActivatedRoute, UrlSegment } from '@angular/router';

@Component({
  selector: 'app-new-user-input',
  templateUrl: './new-user-input.component.html',
  styleUrls: ['./new-user-input.component.css'],
  animations: [slideToRight()]
})
export class NewUserInputComponent implements OnInit {

  newUserInfoComplete = false;

  @Output() newUserInfoCompleteEvent = new EventEmitter<boolean>();

  constructor(private router: Router, r: ActivatedRoute) {
    r.url.subscribe((s: UrlSegment[]) => {
      console.log("url", s); //https://vsavkin.com/angular-router-understanding-router-state-7b5b95a12eab
    });
  }

  ngOnInit() {
  }



  sendNewUserInfoComplete() {
    this.newUserInfoCompleteEvent.emit(this.newUserInfoComplete);
  }


  displaySibling() {
    console.log(this.router);
    this.router.navigate(['../', { outlets: { newuserorginfo: ['newuserorginfo'] } }])
  }

  closeBlade() {
    this.router.navigate([{ outlets: { newuserinput: null } }]);
  }

}

- imnickvaughn

Answer 4

你导入的方式有误，请从@angular/core中导入EventEmitter

import { EventEmitter } from @angular/core

- Kelvin Onkundi

Answer 5

只需替换自动添加的导入语句：

    import * as EventEmitter from 'events';        

使用

    import { Component, OnInit, Output ,EventEmitter} from '@angular/core';        

- Techie Vineet

Answer 6

如顶部答案所述，不要从“protractor”导入“EventEmitter”，而应该从“@angular/core”中导入。

为什么会发生这种情况：因为您在导入之前使用了“EventEmmiter”，所以在这种情况下它会自动从“protractor”模块中导入。

- Husain Ali

Answer 7

import { EventEmitter, Component, OnInit, Output } from '@angular/core';

请确保导入了位于@angular/core中的EventEmitter，否则会出现错误。

我犯了错误。我导入了-

 import { EventEmitter } from 'events';

出现错误，获取失败。

- Avinash Dewangan

Answer 8

不要像下面这样使用事件进行导入：

import { EventEmitter } from 'events';

请尝试以下方式进行导入：

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

- Mahadevan Annamalai

Answer 9

import { Component, Output } from '@angular/core';
import { slideToRight } from '../../../../router.animations';
import { Router, ActivatedRoute, UrlSegment } from '@angular/router';
import { EventEmitter } from 'protractor';

@Component({
  selector: 'app-new-user-input',
  templateUrl: './new-user-input.component.html',
  styleUrls: ['./new-user-input.component.css'],
  animations: [slideToRight()]
})
export class NewUserInputComponent {

  newUserInfoComplete = false;
  @Output() newUserInfoCompleteEvent = new EventEmitter <boolean> ();

  constructor(private router: Router, r: ActivatedRoute) {
    r.url.subscribe((s: UrlSegment[]) => {
      console.log("url", s);
    });
  }
  sendNewUserInfoComplete(){
    this.newUserInfoCompleteEvent.emit(!!this.newUserInfoComplete);
  }


  displaySibling() {
    console.log(this.router);
    this.router.navigate(['../', { outlets: { newuserorginfo: ['newuserorginfo'] } }])
  }

  closeBlade() {
    this.router.navigate([{ outlets: { newuserinput: null } }]);
  }

}

尝试这个。

- ignacioSG

---

当您分配变量时，无需设置数据类型。TS会自动为您设置它。如果您不实现Oninit，则删除它。 - ignacioSG

非常感谢你的“试一试”，每一个小建议都有所帮助！虽然没有解决问题，但是因为你我找到了问题所在……我知道看起来有点奇怪。 - imnickvaughn