在* Angular 2

时间:2016-04-09 14:16:21

标签: angular angular2-routing

只要承诺未得到解决,我就想阻止访问路线。另外,我想将该promise的返回值传递给路由组件。

Several posts SO建议使用OnActivate界面。 documentation说:&#34;如果routerOnActivate返回一个承诺,路由更改将等到承诺确定实例化并激活子组件。&#34;听起来很完美,只有路线仍然立即被激活......(是因为它是等待承诺的Route2的子组件,而不是Route2组件本身?)< / p>

https://plnkr.co/edit/ipKrOgfRj0vKk8ZejH5v?p=preview。 Route2组件实现OnActivate接口,但是当您单击Route2链接时,会立即激活Route2组件。但是,只有在承诺解决后,URL才会更新为/route2。 (在一个单独的窗口中启动Plunker,看看我的意思。)现在我不太关心URL,在承诺解决之前,Route2组件根本不应该实例化。

我的另一个策略是使用@CanActivate装饰器。它更适合我的目的,因为路由器调用它来确定组件是否可以作为导航的一部分进行实例化。

这里的问题是如何将数据从@CanActivate装饰器中的承诺传递到组件

我看到有人将他们的数据写入装饰器的next参数的属性中,并在next方法的routerOnActivate参数中检索它。

例如next.paramshere):

@CanActivate((next) => {
  return messageService.getMessage()
      .then((message) => {
         next.params.message = message;
         return true;
      });
})
export class MyComponent implements OnActivate {
  routerOnActivate(next) {
    this.message = next.params.message;
  }
}

next.routeData.datahere)。

但是documentation表示ComponentInstruction对象&#34;应该被视为不可变的&#34;。这很令人困惑。

这是最好的方法吗?

也许处于当前状态的路由器没有最终确定,并且在发布稳定的Angular 2时会有更好的方法吗?

1 个答案:

答案 0 :(得分:2)

<强>更新

这是在新路由器>= RC.4

中实现的
import { Injectable }             from '@angular/core';
import { Router, Resolve,
         ActivatedRouteSnapshot } from '@angular/router';
import { Observable }             from 'rxjs/Observable';
import { Crisis, CrisisService } from './crisis.service';
@Injectable()
export class CrisisDetailResolve implements Resolve<Crisis> {
  constructor(private cs: CrisisService, private router: Router) {}
  resolve(route: ActivatedRouteSnapshot): Observable<any> | Promise<any> | any {
    let id = +route.params['id'];
    return this.cs.getCrisis(id).then(crisis => {
      if (crisis) {
        return crisis;
      } else { // id not found
        this.router.navigate(['/crisis-center']);
        return false;
      }
    });
  }
}

<强>原始

  

也许处于当前状态的路由器没有最终确定,并且在发布稳定的Angular 2时会有更好的方法吗?

实际情况如此。最近有很多关于进一步进展的讨论,并计划进行一些改变。

另见
- Angular Weekly Meeting(4月4日)
- Router: Design for routerCanActivate, an injectable alternative to @CanActivate

  

我看到人们将他们的数据写入装饰器的下一个参数的属性中,并在routerOnActivate方法的下一个参数中检索它。

AFAIK params应该是不可变的,不应该被修改。

[router] CanActivate and DI中的讨论显示如何将DI与CanActivate一起使用。这是我将使用的方法。全局共享服务并将其注入CanActivate以更新值,并将其注入您希望访问该值的组件中。