MartinP MartinP - 4 months ago 20
AngularJS Question

Signup page not opening in ionic

Having an login.html it has

SignUp Button
while click on it its not opening the
signup.html
page

index.html

<body ng-app="starter" ng-controller="AppCtrl">
<ion-nav-bar class="bar-calm">
</ion-nav-bar>
<ion-nav-view></ion-nav-view>
</body>


login.html

<ion-view view-title="Sign-In" name="login-view">
<ion-content class="padding">
<button class="button button-block button-positive" ng-click="signup()">SignUp</button>
</ion-content>
</ion-view>


app.js

angular.module('starter', ['ionic', 'ngMockE2E','ui.router'])
.run(function ($ionicPlatform) {
$ionicPlatform.ready(function () {
if (cordova.platformId === 'ios' && window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if (window.StatusBar) {
StatusBar.styleDefault();
}
});
})

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

.state('login', {
url: '/login',
templateUrl: 'templates/login.html',
controller: 'LoginCtrl'
})
.state('signup', {
url: '/signup',
templateUrl: 'templates/signup.html',
controller: 'SignupCtrl'
})
$urlRouterProvider.otherwise('/login');
})


controller.js

.controller("SignupCtrl", function ($scope, $state, $ionicPopup, AuthService) {
$scope.data = {};
$scope.signup = function () {
$state.go('singup');
};
})

.controller('LoginCtrl', function ($scope, $state, $ionicPopup, AuthService) {
$scope.data = {};

$scope.login = function (data) {
AuthService.login(data.username, data.password).then(function (authenticated) {
$state.go('main.dash', {}, { reload: true });
$scope.setCurrentUsername(data.username);
}
};
})


and inside the
templates folder
is having
signup.html


<ion-view view-title="Signup" name="Signup-view">
<ion-content padding="true" class="has-header">
<form id="signup-form2" class="list ">

// sign up fields goes here.....

<a ui-sref="login" id="signup-button5" style="border-radius:15px 15px 15px 15px;" class="button button-calm button-block" ng-click="signupEmail(data)">Sign up</a>
</form>
</ion-content>
</ion-view>

Answer

I think you are missing the state change function in your LoginCtrl. So you should have it declared in the LoginCtrl because that controller is used in the login.html.

.controller("LoginCtrl", function ($scope, $state) {
  $scope.signup = function () {
    $state.go('signup');
  };
})

Also consider that in your example code you had a typo in the $state.go function. Your state name is singup when it should be signup.