大师网-带你快速走向大师之路 解决你在学习过程中的疑惑,带你快速进入大师之门。节省时间,提升效率

Angular4 不同页面中进行通信

这里用的还是订阅者模式
深入理解Angular订阅者模式
我在项目当中用的是那个subject,在A页面操作成功发生一个通知到B页面

// rest.service.ts
  send(message: any) {
        this.subject.next(message);
    }

    get(): Observable<any> {
        return this.subject.asObservable();
    }
// A页面发送消息 left.component.ts
  handleRoute(name) {  
    this.router.navigate(['/' + name],{queryParams:{temp:this.temp}});   // 路由传参
// 通过 activedRoute 的snapShot的queryParams["temp"]接收参数或者是
//接收多个参数
constructor(
    private activatedRoute: ActivatedRoute,   //这里需要注入ActivatedRoute模块
) {
    activatedRoute.queryParams.subscribe(queryParams => {
        let productId = queryParams.productId;
        let title = queryParams.title;
    });
    this.restService.send('who are you ?') // 发送消息
  }
// B页面接收消息 upcoming-process.component.ts
  ngOnInit() {
    // 监听页面传过来的值
    this.restService.get().subscribe((result) => {
      this.search(); // 接收消息
    })
  }