0

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

应用窗体组件

@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>

名称DisplayComponent

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;
    });
  }

}

我的问题基本上是当我将 angular cli 与命令 ng server --aot 一起使用时,由于此错误而无法编译:

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

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

有任何想法吗?

4

1 回答 1

0

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

(nameChange)="update($event)"

但它接受数字。

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

请更改方法如下。

update(event:any) {
    const personId = event as number
    alert("update name");
 }
于 2018-06-29T16:17:11.383 回答