问题描述
我是 Angular 的新手,我不完全了解 Angular 生命周期的工作原理。
在我的 NgOnInit()
函数中,我调用了从 http 模块返回数据的异步数据服务。然后,它将我的类变量设置为等于返回的数据。
但是,我的 NgAfterViewInit()
没有接受这些更改。任何人都可以向我解释为什么以及如何解决这个问题?
我的组件:
export class LeafletMapComponent implements OnInit,AfterViewInit {
data;
constructor(private ps: PeopleService,private ngzone: ngzone) {}
async ngOnInit(): Promise<void> {
const res = await this.ps.httpGetData().toPromise();
this.data = res;
console.log(this.data); //WORKS,but why doesn't it work in the NgAfterInit function?...
}
ngAfterViewInit(): void {
console.log(this.data); //DOESN'T WORK (logs undefined),but doesn't this run after ngOnInit?
}
}
我的服务:
...
export class PeopleService implements OnInit {
...
constructor(private http: HttpClient) {}
httpGetData() {
return this.http.get<any>(this.URL);
}
}
编辑:此组件的目的是渲染地图。该组件使用 NgAfterViewInit
是因为它呈现了一个传单地图 API(类似于谷歌地图)。但我也想将一些数据传递到 NgAfterViewInit
中,以便我可以在地图上动态呈现标记/图钉,并且这些数据是从我的服务 PeopleService
中检索的,该服务使用 {{1} } 模块获取数据。
提前致谢!
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)