Question

我一直在尝试Angular 9，并且一段时间以来一直坚持正确使用@Output()装饰器和EventEmitter类。出于某种原因，我的事件似乎没有冒泡到我的子组件的直接父组件。我的子组件称为NavbarComponent，应该在单击按钮时触发toggletool事件。 navbar.component.ts文件的相关部分如下所示：

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent implements OnInit {

  @Output('toggletool') toggleEvent: EventEmitter<string> = new EventEmitter<string>();

  ...

  toggle(id: string) {
    this.toggleEvent.emit(id);
  }

}

肯定会调用toggle(...)函数，并且正确设置了id参数。我现在正尝试在AppComponent中捕捉事件。模板如下所示：

<app-location-tool [isActive]="toolIsActive('locationtool')" (toggletool)="toggleTool($event)">
</app-location-tool>

app.component.ts文件声明了一个函数toggleTool(...)，如下所示：

toggleTool(event) {
  console.log(event);
}

但是，从未调用此函数（根据缺少的控制台输出判断），我也不知道为什么。我想我已经忽略了一些小错误，希望你们能帮助我。

谢谢。

Answer 1

您组件的选择器是app-navbar，但是您已经使用过app-location-tool

角度9：为什么我的自定义EventEmitter无法正常工作？

1 个答案: