Helo,我正在开发 AngularJS 应用程序。我需要路由方面的帮助。我正在尝试导航到index.html 如果登录成功(login.html)。有很多关于它的例子,但我无法让它们工作 与我的申请。最近,我尝试了this ,但仍然没有运气。
我有 2 个 html 页面; index.html 和 login.html。还有 2 个独立的 Controller 文件; controller.js 和 logincontroller.js
在我的logincontroller.js下面
var myLogin = angular.module('myLogin', [])
myLogin.controller('MyLoginController', function($scope, $http)
{
$scope.Login = function(){
$http(
{...
})
.then(
function successCallback(response) {
$scope.loginresponse = response.data;
if($scope.loginresponse=="OK"){
// here go to index page
}
},
function errorCallback(response) {
alert("Failed to login!");
});
}
});
我的controller.js(用于index.html)
var myApp = angular.module('myApp',[ 'ui.bootstrap.datetimepicker', 'ngclipboard', 'hljs'])
myApp.controller("MyController", function TimeCtrl($scope, $timeout, $filter, $http, $window) {
});
如果需要以下部分:login.html
<!DOCTYPE html>
<html lang="en" data-ng-app="myLogin">
<meta charset="UTF-8">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="web-admin/libs/angular.js"></script>
<script src="web-admin/controllers/logincontroller.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
...
</head>
<body>
<div data-ng-controller="MyLoginController"> ...
index.html:
<!DOCTYPE html>
<html lang="en" data-ng-app="myApp">
<meta charset="UTF-8">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="web-admin/libs/angular.js"></script>
<script src="web-admin/controllers/controller.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js"></script>
...
</head>
<body>
<div data-ng-controller="MyController">
我对很多事情感到困惑;其中之一是我应该把“config”放在哪里?在controllerjs或logincontrollerjs或单独的文件中。 如果在单独的文件中,我应该更改 html 文件等中的 data-ng-app 吗?提前致谢!
最佳答案
这里的主要问题是您的模块未连接。
声明 angular.module('myLogin', [])
时,您告诉 Angular 为您提供一个没有依赖项的新模块。
当您声明angular.module('myApp',[ 'ui.bootstrap.datetimepicker', 'ngclipboard', 'hljs'])
时,您告诉 Angular 创建一个具有一些依赖项的新模块,但不提供“myLogin”模块。
所以现在你有两个彼此不了解的模块。
我建议您使用一个模块并重复使用它。重复使用'myApp'
对于两者,只需引用同一个实例,如 angular.module('myApp')
,(如果您不将数组传递给模块,它将获取一个模块而不是创建一个新的)
然后,解决您的重定向问题。查看您发布的链接。您缺少ngRoute
对模块的依赖。注入(inject)后,您可以使用 $location
服务和执行$location.path("home");
在登录成功回调中。
关于javascript - AngularJS - 登录成功后在页面之间导航(使用不同的 html 页面和 Controller ),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53258083/