Mat Morse Mat Morse - 27 days ago 25
Android Question

Ionic $urlRouterProvider.otherwise() not working

I've tried following tutorials as well as looking at other stackoverflow questions but I can't figure what I'm doing wrong.

I built this with the ionic creator and now I'm trying to have the user login to google and after that's complete route to my dashboard.

Sorry this is all brand new to me. If you can explain what I'm doing wrong and why its that way, so I can learn. Thanks!

My controller.js:

angular.module('app.controllers', [])

.controller('loginCtrl', ['$scope', '$stateParams', // The following is the constructor function for this page's controller. See https://docs.angularjs.org/guide/controller
// You can include any angular dependencies as parameters for this function
// TIP: Access Route Parameters for your page via $stateParams.parameterName
function ($scope, $stateParams, $urlRouterProvider) {

$scope.googlelogin = function(){
//alert('yup');
var provider = new firebase.auth.GoogleAuthProvider();
provider.addScope('https://www.googleapis.com/auth/plus.login');
firebase.auth().signInWithPopup(provider).then(function(results){
// This gives you a Google Access Token. You can use it to access the Google API.
var token = results.credential.accessToken;
// The signed-in user info.
var user = results.user;
console.log(user);

$urlRouterProvider.otherwise('/dashboard');
//window.location.href = "dashboard.html";
});
}
}])


My login.html:

<ion-view title="Login" hide-nav-bar="true" id="page4">
<ion-content padding="true" class="manual-ios-statusbar-padding">
<form id="login-form1" class="list">
<div class="spacer" style="width: 300px; height: 40px;"></div>
<div>
<img src="img/7TKZQZBSSg62UJQB4zyu_logo.png" width="30%" height="auto" style="display: block; margin-left: auto; margin-right: auto;">
</div>
<div class="spacer" style="width: 300px; height: 100px;"></div>
<a id="login-button1" class="button button-stable button-block" ng-click="googlelogin()">Google Login</a>
<button id="login-button3" class="button button-stable button-block">Facebook Login</button>
</form>
</ion-content>
</ion-view>


Routes.js:

angular.module('app.routes', [])

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

// Ionic uses AngularUI Router which uses the concept of states
// Learn more here: https://github.com/angular-ui/ui-router
// Set up the various states which the app can be in.
// Each state's controller can be found in controllers.js
$stateProvider



.state('menu.dashboard', {
url: '/dashboard',
views: {
'side-menu21': {
templateUrl: 'templates/dashboard.html',
controller: 'dashboardCtrl'
}
}
})

.state('login', {
url: '/login',
templateUrl: 'templates/login.html',
controller: 'loginCtrl'
})

$urlRouterProvider.otherwise('/side-menu21/dashboard')
});

Answer

your js should be like this

angular.module('app.controllers', [])

    .controller('loginCtrl', ['$scope', '$stateParams', '$state','$location',
    function ($scope, $stateParams,$state,$location, $urlRouterProvider) {

        $scope.googlelogin = function(){

            var provider = new firebase.auth.GoogleAuthProvider();
            provider.addScope('https://www.googleapis.com/auth/plus.login');
            firebase.auth().signInWithPopup(provider).then(function(results){

                var token = results.credential.accessToken;

                var user = results.user;
                console.log(user);

               $state.go('menu.dashboard'); 

//or you may use location like below
//$location.path('/dashboard');
                });
            }
        }])
Comments