登錄頁面重定向角度驗證

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

app.config(['$routeProvider', function($routeProvider) {  
    $routeProvider. 
    when('/success', { 
    templateUrl: 'success.html', 
    controller: 'sucCtrl' 


    }). 
    otherwise({ 
    redirectTo: '/index' 
    }) 
}]) 


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

    $scope.submit = function(user,password) { 
    //for local storage validation 

    $http.get('credentials.json').then(function(response) { 
     $scope.credentials = response.data; 

     if((user === $scope.credentials.username) && (password === $scope.credentials.password)){ 
     alert("ok"); 
     $location.path('/success'); 
     } 

     else{ 
     alert("nit "); } 



    });  


    }; 

}) 

app.controller('sucCtrl',['$scope', function($scope) { 
    alert("succs"); 

}]);

這可能是一個初學者的問題。我試圖驗證我的登錄表單，併成功重定向到success.html。但我無法導航到下一頁。我嘗試使用$ location.path（'/ success'）。這裏是plunker工作樣本.. http://plnkr.co/edit/0v7njznHdtwgpaG2NfwA?p=preview 登錄頁面重定向角度驗證

來源

2015-09-06 user5304396

你錯過了寫ng-view指令來獲取路由變化對視圖中顯示。你也搞砸了頁面html的結構。請參閱下面的評論，這將有助於您使其工作並改進。

您應該將該ng-view指令放在主體中，以便所有視圖都會根據路由更改加載。

你也應該只從路線加載HTML表單，我建議你多了一個路由添加到您的config會說上/login顯示form.html（登錄表單）

配置

app.config(['$routeProvider', function($routeProvider) {  
    $routeProvider. 
    when('/success', { 
    templateUrl: 'success.html', 
    controller: 'sucCtrl' 
    }) 
    .when('/login', { 
    templateUrl: 'form.html', 
    controller: 'validateCtrl' 
    }). 
    otherwise({ 
    redirectTo: '/login' 
    }) 
}])

標記

<body> 
    <div ng-view></div> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.js"></script> 
    <script src="login.controller.js"></script> 
</body>

你success.html應該是局部的，它不應該再有腳本引用它，他們已經從索引頁只

success.html加載

<div> 
    Success Message 
</div>

Working Demo

來源

2015-09-06 08:03:02

你好。感謝您的答覆。我嘗試添加這些更改。但是在添加ng-view時，我的瀏覽器瀏覽器正在崩潰。你能幫我 – user5304396

@ user5304396看起來像我把錯誤的plunkr link..let我加上正確的一個..給我一分鐘 –

@ user5304396看看udpated plunkr鏈接謝謝:) –

登錄頁面重定向角度驗證

回答

相關問題