Question

我有一个索引页面（登录），其中存在注册链接，所以在重定向时我正在尝试加载控制器但是它没有加载也没有控制台中的错误。

我的主页加载了网址：http://localhost:8081/WebServices/ 点击resgiter后，我试图将其重新映射到：http://localhost:8081/WebServices/#/regsiter

帮助将不胜感激。

我的index.html页面

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Login Page</title>

<script type="text/javascript" src= "/WebServices/js/angular.min.js"></script>
<script type="text/javascript" src= "/WebServices/js/angular-resource.min.js"></script>
<script type="text/javascript" src= "/WebServices/js/angular-route.min.js"></script>
<script type="text/javascript" src= "/WebServices/js/friendsCtrl.js"></script>
<script type="text/javascript" src= "/WebServices/js/friendsService.js"></script>
<script type="text/javascript" src= "/WebServices/js/loginCtrl.js"></script>
<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css"> 
</head>

<body>
   <div ng-app="loginApp">

      <div class="col-md-3">

    <h2>Login</h2>
    <form name="loginform" role="loginform" ng-submit="login()">

        <div class="form-group" ng-class="{ 'has-error':loginform.username.$dirty && loginform.username.$error.required }" >
            <label for="username">Username</label>
            <input type="text" name="username" class="form-control" ng-model="user.username" required />
            <span ng-show="loginform.username.$dirty && loginform.username.$error.required " class="help-block">Username is required</span> 
        </div>

        <div class="form-group" ng-class="{ 'has-error':loginform.username.$dirty && loginform.username.$error.required }">
            <label for="Password">Password</label>
            <input type="password" name="password" class="form-control" ng-model="user.password" required />
            <span ng-show="loginform.password.$dirty && loginform.password.$error.required " class="help-block">Password is required</span>
        </div>

        <div class="form-actions">
            <button type ="submit" class="btn btn-primary" ng-disabled="loginform.$invalid">Login</button>
            <a href="#/regsiter" class="btn btn-link">Resgiter</a>
        </div>


    </form>
</div>

</div> 
</body>
</html>

loginCtrl.js文件

var loginApp=angular.module('loginApp',['ngRoute']);

loginApp.config(['$routeProvider', function($routeProvider){
    $routeProvider
        .when('/' , { 
            templateUrl:'index.html',
            controller: 'loginCtrl'
        })
        .when('/regsiter' , { 
            templateUrl:'registration_ang.html',
            controller: 'loginCtrl'
        })
        .otherwise({
            redirectTo:'/'
        });

}]);


loginApp.controller('loginCtrl',['$scope',function($scope){
    console.log("controller loaded");
    alert("controller loaded");
    $scope.login=function(){
        console.log("inside loginCtrl : login function");
        alert("checking login.");
    };
}

]
);

Answer 1

您错过了在您的网页上添加ng-view指令，因此会加载模板＆amp;在$routeProvider指令元素ng-view内配置的控制器。

<div ng-view></div>

Angularjs ngRoute无法正常工作

1 个答案: