how to stop url appending in angular 2 application using core angular2 router

Question

My application is getting appened inside another application and I cannot append anything in the url as parent application is restrict.

Is there a way I can stop appending in the url. I am able to do the same in angular2 alpha 34 build by this.router.navigate(value, true);

I want to do the same in @angular:2.0.1 and in the html not in my typescript class by defining a method and calling it on (click).

Answer 1

Sounds like you are looking for skipLocationChange:

router.navigate(['team', 33, 'user', 11], {relativeTo: route, skipLocationChange: true });

See also https://angular.io/docs/ts/latest/api/router/index/Router-class.html

Answer 2

skipLocationChange: true prevent angular2 to append anything in URL. As @Günter Zöchbauer suggested, You need to pass skipLocationChange: true as the default value is false.

full code will be:

import { Router }   from '@angular/router';

export class MovingInPages {

    constructor(private router: Router) {
    }

    moveToAnotherPage(value: string) {
        this.router.navigate([value], { skipLocationChange: true });
    }
}

The html will be like below:

<button type="button"  (click)="moveToAnotherPage('another-page-route')" class="btn btn-primary">Another page</button>