How to hide stateProvider url displayed in Address bar using Angular JS?

Question

All,

I am using Angular JS 1.3.0 stateProvider URL for URL routing.

During run time whenever state is being redirected to particular URL , it displayed on the Address bar and it exposes the information about Employee id. Like in this image.

Is it possible to hide those potential information using Angular JS 1.3.0?

Answer 1

The personId is displayed in the url, because its defined as URL parameter.

But we can avoid that, by defining it with params notation:

.state("peopleDetail", {
    url : "/",
    params : { personId : null },
    ...
}

Check the doc:

$stateProvider

A map which optionally configures parameters declared in the url, or defines additional non-url parameters. For each parameter being configured, add a configuration object keyed to the name of the parameter.

...
Each parameter configuration object may contain the following properties:

• value
• array
• squash -- (see more in that resource)

For similar stuff and some more details, please check:

Angular ui router passing data between states without URL