Angular兄弟组件之间的交互

方法一：兄弟组件之间可以用服务进行交互
具体如下：
一、新建一个service.ts如下：

import {Injectable} from '@angular/core';
import {BehaviorSubject} from 'rxjs';
import {Observable} from 'rxjs';

@Injectable({
provideIn: 'root'
})
export class ModalService {
private renderSubject: BehaviorSubject<any> = new BehaviorSubject<string>(null);

public getSubject(): Observable<any> {
return this.renderSubject;
}

public emitInfo(msg: any): void {
if (msg) {
this.renderSubject.next(msg)
	}
}

constructor() {}
}

二、在module的providers加上该服务

providers: [ModalService]

三、组件一要发送内容给兄弟组件二
1、首先在ts中引入服务

import {ModalService} from ''

2、构造函数中注入

constructor(private modalService: ModalService) {}

3、用服务发送数据

sendId() {
this.modalService.emitInfo(this.detail);
}

四、组件二接收传过来的值
1、引入服务

import {ModalService} from ''

2、注入构造函数

constructor(private modalService: ModalService) {}

3、接收传过来的数据

this.modalService.getSubject().subscribe(res => {
})

方法二：还可以用路由传参
组件一要给组件二传参，组件一ts部分代码如下
1、引入Router

import {Router} from '@angular/router';

2、构造函数中注入Router

constructor(private router: Router) {}

3、在方法中传参

sendParam() {
	this.router.navigate(['abc/info'],{
		queryParams: {
		id: this.infoId
		}
	});
}

组件二接收参数id
1、引入ActivatedRoute

import {ActivatedRoute} from '@angular/router';

2、构造函数中注入

constructor(private activatedRoute: ActivatedRoute) {}

3、获取参数

this.activatedRoute.queryParams.subscribe(param => {
this.id = res.id
})