Angular2:解析路径和路由路径中的数据有何区别?

sma*_*use 3 parameters components angular2-routing angular2-router angular

我看到了两种将简单数据(例如字符串)从路由路径传递到不同组件的方法:

第一种方式:

路由方:

export const AppRoutes: Routes = [
  ...
  { 
    path: '/one', component: OneComponent, resolve: { foo: 'foo' }
  }
];
Run Code Online (Sandbox Code Playgroud)

组件侧:

@Component()
export class OneComponent implements OnInit {
    constructor(private route: ActivatedRoute) {}

    ngOnInit() {
        this.foo = this.route.snapshot.data['foo'];
    }
}
Run Code Online (Sandbox Code Playgroud)

第二种方式:

路由方:

const routes: RouterConfig = [
    ...
    {
      path: '/one', component: OneComponent, data : {some_data : 'some value'}
    }
];
Run Code Online (Sandbox Code Playgroud)

组件侧:

@Component()
export class OneComponent implements OnInit {
    constructor(private route: ActivatedRoute) {}

    ngOnInit() {
        this.obs = this.route
          .data
          .subscribe(v => console.log(v));
    }

    ngOnDestroy() {
        this.obs.unsubscribe();
    }
}
Run Code Online (Sandbox Code Playgroud)

那么将值传递给组件的最佳方法是什么?resolvedata属性之间有什么区别?

Gün*_*uer 5

data 是添加到路由的静态数据,而resolve调用的服务也可以使用异步调用来计算数据。

您的resolve示例无效。

参见https://angular.io/docs/ts/latest/guide/router.html#!#resolve-guard