Winkel 2 | Kann keine Eigenschaftenbindung für geroutete Komponente verwenden

Question

Guten Tag,

Kann mir jemand sagen, was ist/sind die alternative Möglichkeit, Eigenschaft auf einer gerouteten Komponente zu binden? Es scheint, dass @input() Decorator nicht an der gerouteten Komponente arbeitet.

Danke

Answer 1

Verwenden Sie Router-Parameter. Also, in Ihrer Router-Konfiguration, haben Sie den Router-Pfad zu Ihrer Komponente (wie "MyComponent") wie folgt;

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

Und übergeben Sie den tatsächlichen Wert an den Router in Ihrem Anker-Tag in HTML wie;

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

oder in Ihrem Stammkomponente, navigieren programmatisch MyComponent;

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

Und in der Komponente (MyComponent), importieren Sie die ActivatedRoute von Winkel Router, der zu diesen beobachtbaren im ngOnInit Verfahren ein params beobachtbare und abonnieren bietet. So sollte Ihr MyComponent in etwa so aussehen;

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

Lesen Sie weiter here