使用Service时的Angular JS路由问题

时间:2014-07-10 22:47:38

标签: javascript angularjs angular-routing

我有一种情况,如果登录成功,我想将用户重定向到下一页。 否则它应该留在登录页面上。

这是我设置路由和routeChangeStart监听器的代码。

function () {
"use strict";
angular.module("app", ["ngRoute", "ngAnimate", "ui.bootstrap", "easypiechart", "mgo-angular-wizard", "textAngular", "ui.tree", "ngMap", "app.ui.ctrls", "app.ui.directives", "app.ui.services", "app.controllers", "app.directives", "app.form.validation", "app.ui.form.ctrls", "app.ui.form.directives", "app.tables", "app.map", "app.task", "app.localization", "app.chart.ctrls", "app.chart.directives", "app.tekcapital.authModule"]).config(["$routeProvider", function ($routeProvider) {
    return $routeProvider.when("/", {
        templateUrl: "web-view/dashboard.html"
    }).when("/dashboard", {
        templateUrl: "web-view/dashboard.html"
    }).when("/pages/features", {
        templateUrl: "web-view/pages/features.html"
    }).when("/pages/login", {
        templateUrl: "web-view/pages/login.html"
    }).when("/pages/login_fail", {
        templateUrl: "web-view/pages/login_fail.html"
    }).when("/pages/create_idn_1", {
        templateUrl: "web-view/pages/create_idn_1.html"
    }).when("/pages/create_idn_2", {
        templateUrl: "web-view/pages/create_idn_2.html"
    }).when("/pages/create_idn_3", {
        templateUrl: "web-view/pages/create_idn_3.html"
    }).when("/pages/create_idn_4", {
        templateUrl: "web-view/pages/create_idn_4.html"
    }).when("/pages/create_idn_5", {
        templateUrl: "web-view/pages/create_idn_5.html"
    }).when("/pages/create_idn_6", {
        templateUrl: "web-view/pages/create_idn_6.html"
    }).when("/pages/create_idn_7", {
        templateUrl: "web-view/pages/create_idn_7.html"
    }).when("/pages/signin", {
        templateUrl: "web-view/pages/signin.html"
    }).when("/pages/signup", {
        templateUrl: "web-view/pages/signup.html"
    }).when("/pages/lock-screen", {
        templateUrl: "web-view/pages/lock-screen.html"
    }).when("/pages/profile", {
        templateUrl: "web-view/pages/profile.html"
    }).when("/404", {
        templateUrl: "web-view/pages/404.html"
    }).when("/pages/500", {
        templateUrl: "web-view/pages/500.html"
    }).when("/pages/blank", {
        templateUrl: "web-view/pages/blank.html"
    }).when("/pages/invoice", {
        templateUrl: "web-view/pages/invoice.html"
    }).when("/pages/services", {
        templateUrl: "web-view/pages/services.html"
    }).when("/pages/about", {
        templateUrl: "web-view/pages/about.html"
    }).when("/pages/contact", {
        templateUrl: "web-view/pages/contact.html"
    }).when("/tasks", {
        templateUrl: "web-view/tasks/tasks.html"
    }).otherwise({
        redirectTo: "/404"
    })
}]).run(function($rootScope,$location,UserService){
    $rootScope.$on("$routeChangeStart", function(event,next, current){
        if(UserService.isLogged == null || !UserService.isLogged){
            if(next.templateUrl === "web-view/pages/login.html"){
            }else{
                $location.path("/pages/login");
            }
        }
    });
});

}。调用(这)

以下是我的登录页面

    <div class="page page-general" ng-controller="AuthController">

<div class="signin-header">
        <div class="container text-center">
            <section class="logo">
            <span class="logo-icon "><img src="images/assets/logo_RS.png" width="262" height="48" alt="tekcapital" /></span>

            </section>
        </div>
    </div>

    <div class="signup-body">
        <div class="container">
            <div class="form-container">

                 <section class="row signin-social text-center bg-info" style="padding: 12px 0">
                   Sign In To Tekcapital IDN

                </section>

                <span class="line-thru"></span>

                <form class="form-horizontal" name="loginForm" novalidate>
                    <fieldset>
                        <div class="form-group">
                            <div class="input-group input-group-lg" style="width:100%;">

                                <input type="username" class="form-control" placeholder="username" ng-model="loginForm.userName" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="input-group input-group-lg" style="width:100%;">

                                <input type="password" class="form-control" placeholder="password"  ng-model="loginForm.password" required>
                            </div>
                        </div>
                        <div>{{loginForm.$valid}}</div>
                        <div class="form-group">
                            <a href="#/pages/create_idn_1" class="btn btn-primary btn-lg          btn-block" ng-click="getData()">Login</a>
                        </div>
            </div>
        </div>
    </div>
</div>

这是我的服务代码和控制器

function () {
    "use strict";
    angular.module("app.tekcapital.authModule", []).factory("UserService", [function () {
        var sdo = {
            isLogged: false,
            username: ''
        };
        return sdo;
    }]).controller("AuthController", ["$scope", "$http", "UserService", function ($scope, $http, UserService) {
        $scope.validUser = "";
        $scope.loginForm = {};
        $scope.getData = function () {
            $http.post("http://localhost:8191/authenticate",{"userName":$scope.loginForm.userName,"password":$scope.loginForm.password})
                .success(function(dataFromServer, status, header, config){
                    console.log("data from server " + dataFromServer);
                    console.log("User Service " + UserService.isLogged)
                    if(dataFromServer == "true"){
                        UserService.isLogged = true;
                        UserService.username = "Test User Name";

                    }else{
                        UserService.isLogged = false;
                        UserService.username = "";
                    }
                    console.log("User Service 2 " + UserService.isLogged)
                });
        };
    }])
}.call(this);

现在的问题是,当我第一次验证它停留在登录页面上时。在第二次成功尝试时,它会重定向到另一个页面。 如果凭据错误,它可以正常工作。它保留在登录页面上。 即使我使用$ location.path('after / login / page'),它也会将我移动到该登录页面。 但当我用“localhost:8191 /#/ pages / success /打开一个新选项卡时,它再次带我登录页面。 如果我已登录一次,则不应该带我登录页面。 在这方面需要帮助。

此致

0 个答案:

没有答案