Linking To States
Angular provides the
ngHref directive which allows us to bind variables to URLs. UI-Router provides us with ui-sref which allows us to link to states. This is different than linking to a normal URL. When using UI-Router you want to link to a state, not a URL.
Examples:-
Let’s say we have a state like so:
$stateProvider
.when('party', {
url: '/party',
template: '<h1>This Is A State</h1>'
});
Now to link to it in one of our views:
<a ui-sref="party">Go To Party</a>
This will turn into
<a href="/party" ui-sref="party">Go To Party</a> in our browser. Notice how the href is generated for us.
$stateProvider
.when('party', {
url: '/party',
template: '<h1>This Is A State</h1>'
});
Now to link to it in one of our views:
<a ui-sref="party">Go To Party</a>
This will turn into
<a href="/party" ui-sref="party">Go To Party</a> in our browser. Notice how the href is generated for us.