2016-11-07 7 views
0

Я пытаюсь создать простое приложение для входа в угловом JS

следующего мой login.html

<!DOCTYPE html> 
 
<html ng-app="AppName"> 
 
<head> 
 
\t <title></title> 
 
    
 
</head> 
 
<body> 
 
<div ng-controller="loginCtrl"> 
 
    <form action="/" id="myLogin"> 
 
    Username: <input type="text" id="username" ng-model="username"><br> 
 
    Password: <input type="password" id="password" ng-model="password"><br> 
 
    <button type="button" ng-click="submit()">login</button> 
 

 
    </form> 
 

 
</div> 
 

 
    
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
    <script type="text/javascript" src="angular-route.min.js"></script> 
 
    <script type="text/javascript" src="controller.js"></script> 
 
</body> 
 
</html>

и после моего controller.js

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

 
app.config(function($routeProvider){ 
 

 
\t $routeProvider 
 
\t .when('/', { 
 
\t \t templateUrl: 'login.html' 
 
\t }) 
 
\t .when('/dashboard', { 
 
\t \t templateUrl: 'dashboard.html' 
 
    }) 
 
    .otherwise({ 
 

 
    \t redirectTo: '/' 
 
    }); 
 

 
}); 
 

 
app.controller('loginCtrl', function($scope, $location){ 
 

 
\t $scope.submit = function(){ 
 

 
\t \t var uname = $scope.username; 
 
\t \t var password = $scope.password; 
 

 
\t \t if ($scope.username == 'admin' && $scope.password == 'admin') { 
 

 
\t \t \t $location.path('/dashboard'); 
 
\t \t \t console.log($location.path()); 
 
\t \t } 
 
\t \t else 
 
\t \t \t { 
 
\t \t \t \t alert('wrong password'); 
 
\t \t \t } 
 

 
\t \t \t 
 

 

 
\t }; 
 

 
});

но после отправки он не перенаправляется на dashboard.html. в консоли он показывает только путь/панель. Я новичок в angular.js.

+0

'.when ('/ dashboard', {templateUrl: 'dashboard.html', контроллер: 'loginCtrl'})' –

ответ

0

есть не вид заполнителя быть изменены, вам необходимо DIV с <div ng-view></div>

0

Использованием window.location = "/dashboard";

для загрузки ваших HTML шаблонов, вы должны использовать угловые маршрутизации, как показано ниже

var app = angular.module("myApp", ["ngRoute"]); 
app.config(function($routeProvider) { 
$routeProvider 
.when("/", { 
    templateUrl : "login.htm" 
    ,controller : "LoginController" 
}) 
.when("/dashbord", { 
    templateUrl : "dashbord.htm" 
    ,controller : "DashbordController" 
}) 

}); 
Смежные вопросы