在Angular中,你可以使用ngIf指令来等待变量被初始化后再显示相关的代码。
以下是一个示例:
component.ts:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-my-component',
template: `
`,
})
export class MyComponent implements OnInit {
dataLoaded = false; // 初始化变量
ngOnInit() {
// 模拟异步数据加载
setTimeout(() => {
// 在这里模拟数据加载完成后设置变量为true
this.dataLoaded = true;
}, 2000);
}
}
在上面的代码中,我们使用了*ngIf指令来检查dataLoaded变量是否为true,只有在变量为true时,内部的代码才会被渲染和显示。
这样,当组件初始化时,dataLoaded变量被初始化为false,然后通过ngOnInit方法模拟异步数据加载,2秒后将dataLoaded变量设置为true,此时相关的代码才会被渲染和显示。