Im Winkel 2, wie zu bewahren query params und fügen Sie zusätzliche query params route

So bin ich zum Beispiel auf der route /cars?type=coupe und ich möchten, navigieren Sie zu dem gleichen Endpunkt mit zusätzlichen query params (aber halten vorhandene). Ich versuche, so etwas wie dieses

<a [routerLink]="['/cars']" [queryParams]="{model: 'renault'}" preserveQueryParams>Click</a>

Den Initialen query params sind erhalten (type=Autos), aber Hinzugefügt (Modell=renault) werden ignoriert. Ist diese erwartete/richtige Verhalten oder ist das eine Art bug? Sieht aus wie preserveQueryParams hat Vorrang vor queryParams? Es ist eine andere glatte Lösung?

  • Bei der Verwendung von Anguar 4, ich sehe preserveQueryParams ist veraltet, verwenden Sie queryParamsHandling statt ???
InformationsquelleAutor | 2017-01-18
  1. 16

    Im Winkel 4+, preserveQueryParams wurden verworfen zugunsten von queryParamsHandling. Die Optionen sind entweder 'merge' oder 'preserve'.

    In-code-Beispiel (in NavigationExtras):

    this.router.navigate(['somewhere'], { queryParamsHandling: "preserve" });

    In-template Beispiel:

    <a [routerLink]="['somewhere']" queryParamsHandling="merge">
    • Super Antwort! vielleicht möchten Sie verschmelzen in deinem ersten Beispiel, wie es ist die Einstellung der OP will
    InformationsquelleAutor DarkNeuron
  2. 10

    Es nur funktioniert das so leider nicht:

    const q = preserveQueryParams ? this.currentUrlTree.queryParams : queryParams;

    Könnten Sie versuchen, hinzufügen einer benutzerdefinierten Richtlinie wie diese:

    @Directive({selector: 'a[routerLink][merge]'})
export class RouterLinkDirective implements OnInit
{

    @Input()
    queryParams: {[k: string]: any};

    @Input()
    preserveQueryParams: boolean;


    constructor(private link:RouterLinkWithHref, private route: ActivatedRoute )
    {
    }

    public ngOnInit():void
    {
        this.link.queryParams = Object.assign(Object.assign({}, this.route.snapshot.queryParams), this.link.queryParams);
        console.debug(this.link.queryParams);
    }
}


<a [routerLink]="['/cars']" merge [queryParams]="{model: 'renault'}">Click</a>

    Update: Siehe DarkNeuron Antwort unten.

    InformationsquelleAutor kemsky
  3. 1

    Es ist eine offene Frage und auch schon einen pull-request zu machen preserveQueryParams eine router-Einstellung anstelle einer pro-Navigations-Einstellung

    InformationsquelleAutor Günter Zöchbauer
Schreibe einen Kommentar