如何在AngularDart中導航之前獲取數據？

我想在路由到配置文件之前立即從遠程服務獲取所有數據。如何在AngularDart中導航之前獲取數據？

我發現打字稿版本角度有解決以幫助在導航前獲取數據。但我在Dart版本中找不到任何示例（angular2：^ 3.0.0）。

@RouteConfig(const [ 
    const Route(path: '/', name: 'Home', component: HomeComponent, useAsDefault: true]), 
    const Route(path: '/profile', name: 'Profile', component: ProfileComponent),]) 
class AppComponent implements OnInit{ 

}

任何人都知道如何使用Dart來處理它？

來源

2017-08-29 Roger Chan

Angular.dart中的當前路由器沒有「Resolve」。取決於你試圖完成什麼，可能有不同的解決方法。還有人提到Angular.dart的新路由器正在進行中（可能還需要一段時間） –

Tks爲您的答覆。我想在呈現ProfileComponent之前獲取所有必需的數據，因爲當瀏覽器呈現所有靜態內容並且ProfileComponent中的某個子組件仍在等待異步Http結果時，我嘗試阻止飽和。我希望我的UI顯示整體像服務器端渲染一樣。 –

Angular.dart中的當前路由器沒有Resolve。
根據您嘗試完成的內容，可能會有不同的解決方法。

通常只是包裝的組件模板的內容與

<template [ngIf]="data != null"> ... </template>

應該做的，然後分配給data時，它的可用和組件將被顯示。

另一種更通用的方式可能是創建一個自定義MyRouterOutlet，它可能會擴展RouterOutlet並對其進行自定義，以便延遲添加組件直到收到事件。

添加到RouterOutlet

@HostBinding() 
dataArrived() { 
    // call the code that actually adds the component 
}

然後使用它像

<router-outlet fetchDataDirective></router-outlet>

和像

@Directive(selector: '[fetchDataDirective]') 
class FetchDataDirective implements OnInit { 
    final DataService dataService; 
    FetchDataDirective(this.dataService); 

    @Output() 
    get dataArrived => _dataArrived.stream; 
    final _dataArrived = new StreamController(); 

    ngOnInit() async { 
    await dataService.fetchData(); 
    } 
}

一個指令發出該事件的RouterOutlet等待。

還有人提到Angular.dart的新路由器正在進行中（可能還需要一段時間）。

來源

2017-08-29 15:27:53

如何在AngularDart中導航之前獲取數據？

回答

相關問題