skip to Main Content

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')
});

3

Answers


  1. You should use $state.go('menu.dashboard'); not $urlRouterProvider.otherwise('/dashboard');
    Ionic uses the angular ui router, you can read more about it here: https://github.com/angular-ui/ui-router

    Login or Signup to reply.
  2. 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');
                    });
                }
            }])
    
    Login or Signup to reply.
  3. You can use $location service like below,

    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);
                    $location.path('dashboard'); 
                });
            }
        }])
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search