如何运行代码后，观察和渲染完成角11？
在我的角度11项目中，我有一个可以观察到的改变视图的东西，并且在渲染的时候花了一些时间。
就像这样：
export class MyComponent implements OnInit {
myObservable = of([1, 2, 3]);
constructor() { }
ngOnInit(): void {
this.myObservable.pipe(
// here is some functions
).subscribe();
}
}在ngOnInit运行了可观察的、仍然在运行和处理数据之后。数据到达后，管道更改模板。但这一变化发生在ngAfterViewInit完成之后。因此，我需要一个灵魂，什么运行后，管道和渲染完成了正在发生的事情，因为管道已经完成。
如何运行代码(工具提示初始化)后，我的观察和造成的渲染完成？
ngAfterViewChecked不是一个好的解决方案，因为它总是在视图更改时运行，而且我的工具提示初始化也会改变视图。因此，我只想运行这个初始化一次。
有什么解决办法吗？
回答 3
Stack Overflow用户
发布于 2021-06-28 20:08:46
您可以使用async管道轻松地处理来自可观察对象的数据，如果需要使用RxJS pipe函数，您可以将可观察到的结果保存到一个新变量中，然后在其上使用async管道。
否则，如果管道中的副作用非常复杂，可以使用ChangeDetectorRef手动触发角度变化检测。查看这里的文档。
Stack Overflow用户
发布于 2021-06-28 22:51:32
您可以使用timout函数作为解决方法，页面将在管道之后加载，并在一秒后执行代码，您可以将其缩短到不到1秒，然后通过尝试确定它：
export class MyComponent implements OnInit {
myObservable = of([1, 2, 3]);
constructor() { }
ngOnInit(): void {
this.myObservable.pipe(
setTimeout( ()=>{
// your code here
}, 1000)
).subscribe();
}
}Stack Overflow用户
发布于 2021-06-29 12:36:46
我找到了一个解决办法：
我把所有的代码放在一个独立的组件中，这个组件连接到工具提示。实际上，它是一个带有信息图标的label。在这个组件中，我将工具提示初始化代码放入ngAfterViewInit函数中：
import { AfterViewInit, Component, Input } from '@angular/core';
import { TooltipService } from 'src/app/services/tooltip/tooltip.service';
@Component({
selector: 'app-wizzard-label',
templateUrl: './wizzard-label.component.html',
styleUrls: ['./wizzard-label.component.scss'],
})
export class WizzardLabelComponent implements AfterViewInit {
@Input() field: any = {};
constructor(
private tooltipService: TooltipService,
) { }
ngAfterViewInit(): void {
this.tooltipService.init();
}
}现在，当可观察的结束，消失我的旋转器，并显示这个组成部分。ngAfterViewInit做自己的工作，一切都很好。
https://stackoverflow.com/questions/68167684
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号