Angular 8 通过 service 从A组件向B组件传值,收不到.

Question

8由A组件,跳到B组件.

一. A组件点击事件:

import { ListlevelService } from 'src/app/services/listlevel.service';

... ... 
toInfo(id: string) {

const projectChild = this.projectsTop.filter(p => p.parentProjectId = id); 
if(projectChild.length > 0) {
console.log(projectChild) //数组有值
this.listlevelServe.sendMessage(projectChild) //传值
this.router.navigate(['/sheetInfo', id]); 
}
}

二. service 组件:

@Injectable({
providedIn: ServicesModule
})

export class ListlevelService {

private subject = new Subject<any>();
sendMessage(type:any){
console.log('TAG'+'--->'+type)  //能打印
this.subject.next({type});
}

getMessage():Observable<any> {
return this.subject.asObservable();
}
}

三. B组件:

import { ListlevelService } from 'src/app/services/listlevel.service';
... ...

// 接收消息的地方:

ngAfterViewInit():void {
console.log('1111')  //能打印
this.subscription = this.listlevelServe.getMessage().subscribe(
projectChild => {

console.log(projectChild)
this.projectChild = projectChild
console.log('3333')   //不能打印
})
console.log('2222')  //能打印
console.log(this.subscription)
}

问题出在哪里 ?

Answer 1

你先要确定A和B组件注入的listlevelServe是否是同一个实例，只有A和B组件的listlevelServe的provider相同，注入的才是同一个实例。

如果A和B分别在自己@Component的providers中声明listlevelServe的Service类，那么肯定不是同一个实例，A发送的消息B肯定收不到。如果在根模块或者A/B组件的共同父组件的模块中的providers中声明listlevelServe的Service类，那么二者就是相同的实例，A/B组件可以通过listlevelServe交换数据。