Angular - ngOnInit中的两个订阅导致对象'undefined'

问题描述 投票:3回答:1

简而言之..我无法访问我的新闻对象。在函数中调用时它会以“未定义”的形式返回。

在我的ngOnInit中,我有两个订阅。第一个返回一个新闻对象(在组件的顶部定义为全局变量)。

第二个订阅返回一个路由参数,然后触发一个函数(navigateToArticle)。

现在......当第二个订阅触发'navigateToArticle'函数时,我希望该函数能够访问新闻对象。

但是,每次我尝试控制日志记录新闻对象时,它都会以“未定义”的形式返回。现在我明白这与异步订阅有关。

所以我的问题是,我怎样才能确保新闻对象已被加载并且可以被'navigateToArticle'功能访问。可能会进行某种检查以查看是否已加载新闻?

对不起,我是Angular的新手,所以请放轻松。我确定我错过了一些非常简单的事情。为了清晰起见,我已经将代码剥离到最低限度。

public news: Newswire;

ngOnInit() {

    this._newswireService.getSectors().subscribe((news: Newswire) => {
      this.news = news;
    }

    this._activatedRoute.paramMap.subscribe(params => {
       this.newsID = params.get('id');
       this.navigateToArticle();
    })

}

public navigateToArticle() {
    console.log(this.news);
}
angular asynchronous undefined subscription
1个回答
6
投票

如果要以顺序方式返回observable,则不应嵌套subscribe()方法。相反,我们应该使用RxJS的mergeMap将来自activatedRoute的可观察值映射到内部observable,该内部observable被赋值给newsID属性。然后,我们从getSectors()调用_newswireService方法,并在随后的行中将qepxswpoi中的observable返回。这样,你的subscribe()将不会被定义。

不要忘记将mergeMap导入到您的组件中!

news
© www.soinside.com 2019 - 2024. All rights reserved.