在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
,此时相关的代码才会被渲染和显示。