在angualr2中控制UI渲染

要創建我的初始屏幕，我需要對服務進行一些調用，並且需要在UI中進行更改。現在的挑戰是我不希望我的視圖在得到UI的響應之前呈現。在angualr2中控制UI渲染

有沒有什麼辦法可以防止UI渲染，並獲得服務響應後，我可以要求UI設置我的值後得到渲染？

任何幫助是非常可觀的。

來源

2016-09-30 Ravinder Kumar

正如您在lifecycle documentation中看到的那樣，在渲染之前無法放置鉤子，因爲如果您在ngOnChanges中執行該操作，它將在每次更改時調用。

我不知道爲什麼你要它在視圖呈現之前，但這是一個錯誤的問題。 Angular2的存在是爲了能夠隨時管理你的視圖，所以即使它被渲染，使用的工具如*ngIf，*ngSwitchCase，你可以隨時編輯你的視圖。

您應該將方法中的邏輯綁定到ngOnInit方法中，並使其更改組件中的變量，以便您的視圖一有數據就立即更新。

否則，如果你真的想要的視圖，只有當服務的承諾完成被渲染，你可以用你的組件模板在*ngIf：

<div *ngIf="init"> 
... 
... 
... 
</div>

，然後一旦承諾完成後，就可以設置init爲true：

export class ExampleComponent implements OnInit{ 

    init:boolean=false; 

    constructor(private service:FooService){} 

    ngOnInit():void{ 
     service.bar(...).then(() => 
      { 
       ... 
       this.init = true; 
       ... 
      } 
    } 
}

來源

2016-09-30 07:30:31 Supamiu

我很感謝你的努力。我根據服務的響應呈現菜單項。當最初在服務響應之前查看負載時，用戶無法看到正確的視圖。是的，一旦迴應將會發生，並且* ngIf將執行其任務。當菜單項在運行時改變時，它會顯得很奇怪。所以我希望在UI渲染之前有一切可用。但是，您的解決方案將幫助我。讓我知道你是否有任何連擊想法，否則我會接受這個答案。 –

正如我所說，angular2的目的是使視圖動態，所以最好的解決方案是編輯你的設計的方式，它可以不那麼奇怪，而等待服務響應。 – Supamiu

如果只涉及您的INTIAL屏幕，你應該看看亨利TEMPLIER answer一個類似的問題：渲染應用程序之前等待異步服務。

如果此頁面由路由器加載，則可以使用Angular路由器resolve guard在呈現路由所針對的組件之前等待某個異步調用。

來源

2016-09-30 10:19:23

在angualr2中控制UI渲染

回答

相關問題