Question

我尝试过关注教程以及查看其他stackoverflow问题，但我无法弄清楚我做错了什么。

我使用离子创建器构建了这个，现在我正在尝试让用户登录谷歌，之后是我的仪表板的完整路径。

对不起，这对我来说都是全新的。如果你能解释我做错了什么以及为什么这样做，那么我就可以学习。谢谢！

我的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";
        });
    }
}])

我的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 1

您应该使用$state.go('menu.dashboard');而不是$urlRouterProvider.otherwise('/dashboard'); Ionic使用角度ui路由器，你可以在这里阅读更多相关信息：https://github.com/angular-ui/ui-router

Answer 2

你的js应该是这样的

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

Answer 3

您可以使用下面的$ location服务

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

Ionic $ urlRouterProvider.otherwise（）不起作用

3 个答案: