Question

我希望在路由到Profile之前立即从远程服务获取所有数据。

我发现typescript version angular有 Resolve 以帮助在导航之前获取数据。但我在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处理它？</ p>

Answer 1

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的新路由器正在进行中（可能还需要一段时间）。

如何在AngularDart中导航之前获取数据？

1 个答案: