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
最佳答案
您错过了编写 ng-view
指令来将路线更改显示在 View 上。另外,你的 html 页面结构也很困惑。请参阅下面的评论,这将帮助您使其发挥作用并改进它。
您应该将该 ng-view 指令放在正文中,以便所有 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 应该是部分的,它不应该再次引用脚本,它们仅从索引页加载
成功.html
<div>
Success Message
</div>
关于javascript - Angular 验证中的登录页面重定向,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32421314/