美文网首页
Angular2+ 如何向不关联组件传入数据

Angular2+ 如何向不关联组件传入数据

作者: zewweb | 来源:发表于2022-04-14 10:35 被阅读0次

    关键词 Angular2+

    前言

    众所周知,Angular2+向子组件传递数据用@Input(), 子组件向父组件传递数据用@Output()。现在因为项目需求,需要在Angular2+的不关联组建中传递数据,本文详细介绍了具体步骤和代码。

    步骤

    1.在service文件添加如下代码

    private idSubject: BehaviorSubject<number> = new BehaviorSubject<number>(null);
    public id = this.idSubject.asObservable();
    
    setCurrentId(id: number = null) {
      this.idSubject.next(id);
    }
    

    2.在需要传值的地方call setCurrentId

    this.service.setCurrentId(xx) // xx代表要传入的id
    

    3.在需要调用id的地方添加如下代码

    
    private ngUnsubscribe = new Subject<void>();
    ...
     ngOnInit(): void {
        this.service.id
          .pipe(takeUntil(this.ngUnsubscribe))
          .subscribe((id) => {
            if(id) {
             ....
            }
          });
      }
    

    后言

    希望本文会对你有所帮助,如果有什么问题,可在下方留言沟通

    相关文章

      网友评论

          本文标题:Angular2+ 如何向不关联组件传入数据

          本文链接:https://www.haomeiwen.com/subject/ofqnsrtx.html