В angular 2 как сохранить параметры запроса и добавить дополнительные параметры запроса в маршрут

Например, я нахожусь на маршруте /cars?type=coupe, и я хочу перейти к той же конечной точке с дополнительными параметрами запроса (но сохраняя существующий). Я пытаюсь что-то вроде этого

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

Исходные параметры запроса сохраняются (type = cars), но добавленные (model = renault) игнорируются. Это ожидаемое/правильное поведение или какая-то ошибка? Похоже, что preserveQueryParams имеет приоритет над queryParams? Есть ли другое гладкое решение?

ОТВЕТЫ

Ответ 1

Он просто работает таким образом, к сожалению:

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

Вы можете попробовать добавить настраиваемую директиву следующим образом:

@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>

Ответ 2

В Angular 4 и Angular 5, preserveQueryParams устарели в пользу queryParamsHandling. Возможные значения: 'merge' или 'preserve'.

Пример в коде (используется в NavigationExtras):

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

Пример в шаблоне:

<a [routerLink]="['somewhere']" queryParamsHandling="merge">