在加載所有函數/數據之前不要顯示 .html 組件。 角 2

Question

我在 ngOnInit 中有兩個方法，如下所示：

   ngOnInit() {
    this.getBugId(); // Get Id from URL 
    this.getBugInformation(); // Get the bug information from firebase, the bug that matches the ID passed in
}

getBugId() ：基本上從 URL 獲取 Id 並將其分配給局部變量。

getBugInformation() ：調用服務，連接到 firebase 檢索與我傳入的 bugId 匹配的單個記錄，並填充一個名為 Bug 的類，這是有效的。

// 調用返回承諾的服務的方法。

 getBugInformation() {
    this.bugService
        .getBug3(this.bugId)
        .then(bug => {
            this.bugDetail = bug;
            this.configureForm();
        });
}

我的問題是this.configureForm(); 這基本上是填充 FormControls 內的字段，然后顯示在 .html 頁面上，問題是我的 .html 頁面在功能完成之前出現，導致 formGroup 需要 FormGroup 實例。 請傳入一個。作為錯誤顯示在控制台中，我的問題是。 我怎樣才能阻止 .html 頁面顯示，直到，

this.getBugInformation(); 已完成this.configureForm(); 已經完成。

提前致謝

Answer 1

您正在調用兩個函數。 要解決此問題，您應該創建一個布爾值

display: boolean = false;

現在在函數this.configureForm(); 當你的表單准備好設置this.display = true;

在您的 html 部分，將您想要稍后顯示的所有表單放入帶有 *ngIf 結構指令的 div 塊中，如下所示

<div *ngIf="display">
...... your code here 
</div>

謝謝你。