【问题标题】:angular js route not working角度js路线不起作用
【发布时间】:2015-03-23 02:06:19
【问题描述】:

我有以下代码。我正在尝试制作一个简单的登录和仪表板应用程序。成功登录后,用户可以看到仪表板,我有两个路由登录和仪表板最初登录路由是默认登录成功后,我想路由到仪表板路由,并且应该加载相应的模板和控制器,但不知何故,这不起作用。我需要帮助找出问题所在

index.html

<html lang="en" ng-app="salesApp">
<body ng-controller="loginController">
    <form name="loginForm">
        <!--login form-->
    </form>
    <script src="./js/lib/angular.min.js"></script>
    <script src="./js/lib/angular-route.min.js"></script>
    <script src="./js/app/salesApp.js"></script>
    <script src="./js/controller/loginController.js"></script>
    <script src="./js/services/communicationService.js"></script>

</body>
</html>

loginController.js

app.controller('loginController', function($scope, $http, communicationService, $location){
    $scope.isLoginFailed = false;
    $scope.login= function(){
        $http.get("http://localhost:8080/login?username=" + $scope.user.username + "&password=" + $scope.user.password)
        .success(function(response){
            if(response.sessionId && response.loginSucceeded){
                $location.path("/login");
            }else{
                $scope.isLoginFailed = true;
            }
        });
    }
});

salesApp.js

 var app = angular.module("salesApp", ['ngRoute']);
app.config(['$routeProvider',
        function($routeProvider) {
            debugger;
            $routeProvider.
                when('/login', {
                    templateUrl: '../../login.html',
                    controller: 'loginController'
                }).
                when('/dashboard', {
                    templateUrl: '../../dashboard.html',
                    controller: 'dashBoardController'
                }).
                otherwise({
                    redirectTo: '/login'
                });
        }]);

app.controller('dashBoardController', function($scope, $http, communicationService){
    $scope.sessionData = communicationService.getSessionData();
    $scope.isValidSession - $scope.sessionData.sessionId !== null ? true : false;
    $scope.isValidSession = $scope.isValidSession && $scope.sessionData.loginSucceeded;
}); 

dashboard.html

<html ng-app="salesApp">
<head>
</head>
<div ng-view ng-controller="dashBoardController">
<h1>
demo
</h1>
</body>

但是登录和仪表板路由都没有被触发,谁能帮我找出我做错了什么

【问题讨论】:

    标签: javascript angularjs angular-routing


    【解决方案1】:

    您不必在部分模板中重复 angular ng-appng-view ng-controller="dashBoardController" 指令。像这样更改dashboard.html

    <h1>demo</h1>
    

    但是在index.html 中,您必须将ngView 放在某处。它将被加载的模板填充:

    <div ng-view></div>
    

    使用固定代码查看演示:

    演示: http://plnkr.co/edit/Is3oXmkcRvDYkiAuvnCF?p=preview

    【讨论】:

    • 非常感谢。但是我仍然怀疑我是否将 ng-view 与 ng-controller 一起放入正文,控制台会出现错误。你能解释一下为什么会这样吗?但是如果我将 ng-view 放到 div 中,它可以正常工作
    • 页面上只能有一个 ngView 指令。嵌套视图不能有内部 ngView。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-07-13
    • 2020-11-09
    • 1970-01-01
    相关资源
    最近更新 更多