Angular 2 |不能在路由组件上使用属性绑定

Question

美好的一天，

任何人都可以告诉我什么是绑定路由组件的属性的替代方法吗？看起来@input（）装饰器不能在路由组件上工作。

谢谢

Answer 1

尝试使用路由器参数。因此，在您的路由器配置中，有像这样的组件的路由器路径（被视为“MyComponent”）;

routes: Routes = [ { path: 'mycomponent/:myParam', component: MyComponent} ]。

然后将实际值传递给HTML中锚点标记中的路由器，如：

<a [routerLink]="['/mycomponent', paramValue]"> Link to MyComponent </a>

或在你的父组件，导航到编程MyComponent的;

this.router.navigate(['/mycomponent', paramValue]);

而在你的组分（MyComponent的），从角度路由器，它提供了一个PARAMS可观察导入ActivatedRoute，以及订阅该可观察到的在ngOnInit方法。所以你的MyComponent应该看起来像这样;

import { Component, OnInit, OnDestroy } from '@angular/core'; 
import { ActivatedRoute } from '@angular/router'; 


@Component({ 
    selector: 'my-selector', 
    template: '<div>My Component - Param Value {{myParamValue}}</div> ' 
}) 

export class MyComponent implements OnInit, OnDestroy{ 
myParamValue: any; 
private subscribe: any; 

constructor(private route: ActivatedRoute){} 

ngOnInit() { 
    this.subscribe= this.route.params.subscribe(params => { 
     this.myParamValue = params['myParam']; 
    }); 
    } 

ngOnDestroy() { 
    this.subscribe.unsubscribe(); 
    } 
} 

更多here