代码无法在角度js

时间:2017-06-05 09:07:39

标签: angularjs

//login.html

<div ng-controller="loginController">
<form action="/" id="myLogin">
    User Name:<input type="text" ng-model="uname" /> <br />
    Password: <input type="password" ng-model="passwd"/> <br />
    <button type="button"  ng-click="submit()">login</button>
</form>
</div>

//controller.js

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

app.config(function($routeProvider) {
    $routeProvider

    .when('/', {
        templateUrl: 'login.html'
    })
    .when('/employeeReg', {
        templateUrl: 'employeeReg.html'
    })
    .otherwise({
        redirectTo:'/'
    })
});

app.controller('loginController', function($scope, $location) {
    $scope.submit = function () {
        if ($scope.uname == 'admin' && $scope.passwd == 'admin') {
            $location.path('employeeReg.html');
        } else {
            alert('login failed');
        }
    };
});

Attached Image

我对angular js非常新,这个示例代码仅用于登录页面,但是当我打开索引页面时,没有任何内容可见,它应该重定向到登录页面。任何帮助都会受到关注。

2 个答案:

答案 0 :(得分:0)

首先尝试包含角度:

<script src='JS/angular.min.js'></script>
<script src='JS/angular-route.min.js'></script>

答案 1 :(得分:0)

制作plunker。看起来像工作

https://plnkr.co/edit/kHXK54?p=preview

var app = angular.module('myApp', ['ngRoute','ngSanitize']);

app.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider) {
        $routeProvider
           .when('/', {
        templateUrl: 'login.html',
        controller  : 'loginController'
        })
        .when('/employee', {
            templateUrl: 'employee.html'
        })
        .otherwise({
            redirectTo:'/'
        })
    }]);

app.controller('loginController', function($scope, $location) {
    $scope.submit = function () {
        if ($scope.uname == 'admin' && $scope.passwd == 'admin') {
            $location.path('/employee');
        } else {
            alert('login failed');
        }
    };
});