我正在构建一个有角度的应用程序。我正在通过click事件从第一个组件导航到第二个组件。在导航到第二个组件时，我希望将一些数据从第一个组件传递到第二个组件。我遵循了一个教程来实现此目的，但无法做到。下面是我的代码
第一component.ts
export class FirstComponent implements OnInit {
@Output() messageEvent = new EventEmitter<string>();
constructor(){
}
ngOnInit() {}
sendMessagetoSecond(ahu) {
this.messageEvent.emit(ahu)
console.log(ahu)
}
first component.html
<map name="ahuMap">
<area shape="rect" coords="818,232,917,262" (click)="sendMessagetoSecond()" [routerLink]="['/secondComponent']">
</map>
第二component.ts
ahu : string
receiveMessage($event) {
this.ahu = $event
}
第二个组件.html
<body>
<app-first (messageEvent)="receiveMessage($event)"></app-first>
ahu: {{ahu}}
<div>
....
</div>
</body>
这是我尝试过的。我面临的问题是：1-变量未转移到第二个组件第一个组件的2-HTML也正在第二个组件中加载。是否有我缺少或做错的事情？
在这里，在app.component.ts的构造函数中，将值赋给test.service中的变量，然后将该值赋给变量到view component.component.ts中。