Angular 5 - 事件发射器（类型上不存在属性“更新”......）答案

【问题标题】：Angular 5 - Event emitter (Property 'update' does not exist on type ....)Angular 5 - 事件发射器（类型上不存在属性“更新”......）
【发布时间】：2018-06-29 12:02:16
【问题描述】：

我有一个组件，当一个人的名字发生变化时，我想通过发出一个事件来更新它。我的问题是代码由于错误而无法编译。这是我的代码

ApplicationForm组件

@Output() nameChange = new EventEmitter();

 closeAccordion(isComplete: string, accordionToClose: string, accordion: NgbAccordion) {
    if (accordionToClose === 'personal-details-panel') {
      this.applicationStatusFlags.personalDetailsStatus = (isComplete === 'true');
      this.nameChange.emit({ personId: this.personId });
    }
}

ApplicationFormComponent.html

 <name-display
        [personId]="personId" 
        [placeHolderText]="'Hello'" 
        (nameChange)="update($event)">
 </name-display>

名称显示组件

import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
import { PersonService } from "../../../service/person.service";

@Component({
  selector: 'name-display',
  templateUrl: './NameDisplay.component.html',
  providers: [PersonService]
})

export class NameDisplayComponent implements OnChanges {

  constructor(private readonly personService: PersonService) { }
  @Input() personId;
  @Input() placeHolderText: string = "";

  forename: string = "";

  ngOnChanges(changes: SimpleChanges): void {
    if (changes["personId"]) {
      this.personService.getPersonDetails(this.personId).subscribe((res: IPersonDetails) => {
        this.forename = res.forenames;
      });
    }
  };


  update(personId: number) {
    alert("update name");
    this.personService.getPersonDetails(personId).subscribe((res: IPersonDetails) => {
      this.forename = res.forenames;
    });
  }

}

我的问题基本上是当我使用带有命令 ng server --aot 的 angular cli 时，由于此错误，它无法编译：

ERROR in src\app\component\ApplicationForm\ApplicationForm.component.html(42,9): : Property 'update' does not exist on type 'ApplicationFormComponent'.

我编写了一个类似的组件，它使用了一个没有这个问题的事件发射器，所以我不知道如何修复这个错误。

有什么想法吗？

【问题讨论】：

标签： angular5 angular-cli angular-event-emitter

【解决方案1】：

这是因为您将 $event 传递给方法。

(nameChange)="update($event)"

但它接受数字。

update(personId: number) {
    alert("update name");
}

请按如下方式更改。

update(event:any) {
    const personId = event as number
    alert("update name");
 }

【讨论】：