【发布时间】:2017-09-12 03:49:51
【问题描述】:
我在使用 angularjs 构建单页应用程序时遇到问题。我的应用程序有一个登录页面。如果身份验证成功,应用程序将被路由到主页,其中显示来自 $scope 的一些数据。但是,登录后不会显示任何数据。
登录成功后,我正在使用 location.path 路由到家。作为参考,我试图在 home.html 中打印“$scope.homePageDetails”,但没有打印任何内容。有人可以说,我做错了什么,我该如何解决这个问题?
index.html 文件:
<html>
<body>
<nav>
<ul>
<li ng-hide="isUserLoggedIn"><a href="#login"> <span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</nav>
<div ng-view></div>
</body>
</html>
login.html 文件:
<div>
<form class="form-signin">
<input type="text" class="form-control" placeholder="Email" ng-model="userDetails.userName" required autofocus>
<input type="password" class="form-control" placeholder="Password" ng-model="userDetails.Password" required>
<button class="btn btn-lg btn-primary btn-block" type="submit" ng-click="signIn()">
Sign in</button>
</form>
home.html:
<p> {{homePageDetails}}</p>
角度模块和控制器:
app.controller('myCtrl', ['$scope','$http', '$location' function($scope,$uibModal,$http, $location, $window) {
$scope.signIn = function(){
$http({
url: "http://localhost:3050/postSignIn",
method: "POST",
headers: {'Content-Type': 'application/json; charset=utf-8'
},
data: $scope.userDetails
})
.then(function(response){
console.log('resp is',response);
$scope.isUserLoggedIn = true;
$location.path('/home');
$http({
url: "http://localhost:3050/getHomePageDetails",
method: "GET",
headers: {'Content-Type': 'application/json; charset=utf-8'
}
})
.then(function(response){
$scope.homePageDetails = response.data.slice(0);
}, function(response){
// failure callback
console.log('failure in getting homePageDetails',response);
});
},
function(response){
// failure callback
console.log('failure is',response);
});
}
}]);
模块:
var app = angular.module('myApp', ['ngRoute']);
路由器:
app.config(function ($routeProvider, $locationProvider, $httpProvider) {
$routeProvider.when('/home',
{
templateUrl: 'home.html',
controller: 'myCtrl'
});
}
【问题讨论】:
-
登录页面的控制器是什么?能否提供完整的路由器代码
-
您的主屏幕范围可能与您登录屏幕中的范围不同。
-
@Thanh:我已经更新了控制器。没有多个控制器。我只使用一个控制器。即 myCtrl.
-
您是否正确发布了代码,因为我可以在这里看到一些语法问题?
标签: javascript angularjs