There were many comments and answers which suggested to use routerLink – in different ways. I think, the following is the best way nowadays:

A relative simple link:

<button [routerLink]="/Service/Sign_in">Add Customer</button>

also possible with an array like

<button [routerLink]="['/Service', serviceId, 'Sign_in']">Add Customer</button>

to get a link to /Service/2102/Sign_in where serviceID is 2102.

---

If you have query parameters use:

<button [routerLink]="/Service/Sign_in" [queryParams]="{mode:'red'}">Add Customer</button>

and you receive a link to /Service/Sign_in?mode=red.

---

If your current url already has params (eg /Service/foo?status=bar), you can add keep and add additional params with:

<button [routerLink]="/Service/Sign_in" [queryParams]="{mode:'red'}" queryParamsHandling="merge">Add Customer</button>

which should give you a link to /Service/foo?status=bar&mode=red.

Or you can even preserve the existing ones (if some exist, eg if you are on /Service/foo?mode=blue) with:

<button [routerLink]="/Service/Sign_in" [queryParams]="{mode:'red'}" queryParamsHandling="preserve">Add Customer</button>

and you receive a link to /Service/Sign_in?mode=blue.

---

Some more modes to preserve the history or work with fragments are explained here: https://angular.io/api/router/RouterLink