Ionic 1 nested state not working


#1

I have a problem with nested state in Ionic,

router:

.state("signup",{
  url: "/signup",
  templateUrl:"signup.html",
  controller:"SignCtrl"
  })
  .state("signup.email",{
  url: "/email",
  templateUrl:"signup-email.html",
  controller:"SignCtrl"
  })
  .state("signup.phone",{
  url: "/phone",
  templateUrl:"signup-phone.html",
  controller:"PhoneCtrl"
  })

html:

<button class="button btn_phone" ui-sref="signup.phone">PHONE</button>
<button class="button btn_email" ui-sref="signup.email">Email</button>

When I click in both buttons, I got nothing in page and console, but the link change to:

/signup/phone

/signup/email

I did try this example:

 // MAIN
.state('main', {
  url: '/main',
  abstract: true,
  templateUrl: 'templates/main.html'
})
.state('main.stream', {
  url: '/stream',
  views: {
    'search@': {
      templateUrl: 'templates/search.html',
      controller: 'SearchController'
    },
    'scores@': {
      templateUrl: 'templates/scores.html'
      // controller: 'ScoresController'
    },
    'userCards@': {
      templateUrl: 'templates/cards.html',
      controller: 'CardsController'
    }
  }
})

but not working for me, I got a error:

Cannot transition to abstract state

So, if you have a solution for my problem, I precious that :slight_smile:

Thanks in advance