0
votes

I am trying to do a authentication page in Ionic. The login is working and when I press login the view change to a ion-tab. But when I press "Don't have an account?" the ion-nav-view is not changing the content (the URL is updating from /#/login to /#/login/create). What am I doing wrong?

index.html

...
<ion-nav-view></ion-nav-view>
...

app.js

...
.config(function($stateProvider, $urlRouterProvider) {    
$stateProvider

.state('auth', {
    url: "/login",
    views: {
      '': {
        templateUrl: 'templates/auth-login.html',
        controller: 'AuthLoginCtrl'
      }
    }
  })

.state('auth.create', {
    url: "/create",
    views: {
      'authcreate': {
        templateUrl: 'templates/auth-create.html',
        controller: 'AuthCreateCtrl'
      }
    }
  })
 ...

Login Page

...
<button class="button button-clear button-block button-assertive" ui-sref="auth.create">
 Don't have an account?
</button>
...

auth-create.html

<ion-view title="Create">
    <ion-content class="padding">
        <h1>Create</h1>
    </ion-content>
</ion-view>
1

1 Answers

1
votes

this looks wrong...

.state('auth.create', {
    url: "/create",
    views: {
      'authcreate': { // <=== remove this
        templateUrl: 'templates/auth-create.html',
        controller: 'AuthCreateCtrl'
      }
    }
  })

also I think you have structure the routes incorrectly,I dont know why you are doing the login views this way; I structure mine like this.

// create account state
.state('app-signup', {
    url: "/signup",
    templateUrl: "templates/user/signup.html",
    controller: "SignUpController"
})
// login state that is needed to log the user in after logout
// or if there is no user object available
.state('app-login', {
    url: "/login",
    templateUrl: "templates/user/login.html",
    controller: "LoginController"
})

See complete app here - https://github.com/aaronksaunders/dcww