Ui-sref is not generating the right url for me. Can't find, what I did wrong?

1

Hi I have two separate templates named “home.html” & “home.singleLink.html” in templates folder.

home.html

<ion-list ui-view="singleLinkView">
 <ion-item ng-repeat="link in links">
    <a class="button button-clear" ui-sref="home({singleLink: link.name})">{{link.name}}</a>
 </ion-item>

And I want to show “home.singleLink.html” template when user click on the “a” tag.

Here is my app.config looks like

 $stateProvider
.state('home', {
  url: '/home',
  views: {
    'home': {
      templateUrl: 'templates/home.html',
      controller: 'linksController'
    }
  }   
})
.state('singleLink', {
  url: '/home/:singleLink',
  views:{
    'singleLinkView': {
      templateUrl: 'templates/home.singleLink.html',
      controller: 'linksController'
    }
  }

I saw in a ui-router tutorial video that ui-sref will generate a href when a user click in the link. But in my case there is a href looks like this href="#/home" is already in the html code. When i inspect the link I can see a additional href="#/home" which is not changing when I click in the link.

I can’t find the what is my fault, I am stuck in here from tomorrow. Please help me.
Thanks in advance.

2

Try this.

Remember, ui-sref must reference the target state and the parameter, at this case singleLink

1 Like