Angular 在*激活角2中的管线之前解析值*

我想阻止一条路线被访问，只要承诺还没有解决。另外，我希望将该承诺的返回值传递给route组件

因此，建议为此使用

OnActivate

界面。上面说：“如果

routerOnActivate

返回一个承诺，路由更改将等待承诺解决，以实例化和激活子组件”“听起来很完美，只有路由仍然立即被激活。。。（是因为等待承诺的是Route2的子组件，而不是Route2组件本身吗？？）

看。Route2组件实现了激活界面，但是当您单击Route2链接时，Route2组件会立即激活。但是，只有在承诺得到解决后，URL才会更新为

/route2

。（在一个单独的窗口中启动Plunker，看看我的意思。）现在我不太关心URL，Route2组件在承诺得到解决之前不应该实例化

我的另一个策略是使用

@CanActivate

装饰器。它更适合我的目的，因为“路由器调用它来确定组件是否可以作为导航的一部分实例化”

这里的问题是如何将数据从

@CanActivate

装饰器中的promise传递到组件

我见过人们将数据写入decorator的

next

参数的属性中，然后在

routerOnActivate

方法的

next

参数中检索数据

例如，在

next.params

（）中：

或者在

next.routeData.data

（）中

但该报告称，ComponentInstruction对象“应该被视为不可变的”。这令人困惑

这是最好的方法吗

---

可能路由器在当前状态下还没有最终确定，当稳定的Angular 2发布时，会有更好的方法吗？

更新

这是在新路由器中实现的

=RC.4

从'@angular/core'导入{Injectable}；
导入{路由器，解析，
从'@angular/router'激活的路由快照}；
从“rxjs/Observable”导入{Observable}；
从“/Crisis.service”导入{Crisis，CrisisService}；
@可注射（）
导出类CrisisDetailResolve实现解析{
构造函数（私有cs:CrissService，私有路由器：路由器）{}
解析（路由：ActivatedRouteSnapshot）：可观察



原创

也许路由器目前的状态还没有最终确定，当一个稳定的角度2被释放时，会有更好的方法吗

事实上就是这样。最近有很多关于进一步进展的讨论，并且计划进行一些更改

另见

-（4月4日）

-

我见过人们将数据写入decorator的下一个参数的属性中，并在routerOnActivate方法的下一个参数中检索数据

AFAIK参数应该是不可变的，不应该修改

中的讨论展示了如何将DI与
CanActivate
一起使用。这是我将使用的方法。在全球范围内共享服务，并将其注入
CanActivate
中，以更新值，并将其也注入到您希望访问值的组件中。
AFAIR关于其他方法的问题尚未解决答应解决。
@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;
  }
}

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;
      }
    });
  }
}