gpt4 book ai didi

javascript - AngularJS - 如果登录成功,则在页面之间导航(使用不同的 html 页面和 Controller )

转载 作者:行者123 更新时间:2023-11-29 18:46:42 25 4
gpt4 key购买 nike

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">

我对很多事情感到困惑;其中之一是我应该把“配置”放在哪里?在 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com