如何使用Angularjs解析散列后的URL参数？
如何使用Angularjs解析散列后的URL参数？
提问于 2014-01-02 15:30:29
我正在尝试解析来自Foursquare的access_token，其中的URL如下：
https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX
我已经尝试了$routeParams和$location，但没有得到任何返回。只有在我尝试$route之后，我才得到了一个包含以下属性的对象：
current: {
params: { }
pathParams: { }
loadedTemplateUrl: partials/4sqredirect
locals: { }
scope: {
this: {
$ref: $["current"]["scope"]
}
route: {
$ref: $
}
location: { }
token: null
}
} 这是否意味着由于散列的原因，无法使用原生AngularJS函数获取它？
更新：
我的控制器如下所示：
angular.module('myApp')
.controller('4sqredirectCtrl', function ($scope, $route, $location, $routeParams) {
$scope.route = $route;
$scope.location = $location;
$scope.token = $routeParams.access_token;
});我的主要js如下所示：
angular.module('myApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ngRoute'
])
.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
.when('/', {
templateUrl: 'partials/main',
controller: 'MainCtrl'
})
.when('/4sqredirect/', {
templateUrl: 'partials/4sqredirect',
controller: '4sqredirectCtrl'
})
.otherwise({
redirectTo: '/'
});
});回答 3
Stack Overflow用户
回答已采纳
发布于 2014-01-02 17:20:14
从angular location service $location.hash()方法返回#after-hash
因此，如果您url如下所示
https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX然后
$location.hash()返回access_token=1234567890XXXXX
你需要把它拆分成split('=')[1]
单击4Square，然后单击$location.url() return，即可看到此plunker
/4sqredirect/#access_token=123456
$location.hash().split('=')[1]返回123456
Stack Overflow用户
发布于 2014-01-02 15:37:02
我不知道有一种“原生的角度”的方式来做这件事，但是你确实可以通过字符串类型通过location.hash访问散列。这可能不是理想的，但它是可行的。
Stack Overflow用户
发布于 2014-01-02 16:35:18
事实上，Angular JS并没有为此提供直接支持。我不会使用ngRoute，因为它可能已经期望#位于不同的位置。您的问题的简单解决方案是使用location.hash和substring()函数：
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="http://code.angularjs.org/1.2.6/angular.js"></script>
<link href="style.css" rel="stylesheet" />
<script>
angular.module('app', [])
.controller('AppCtrl', ['$scope', '$window', function($scope, $window) {
$scope.accessToken = $window.location.hash.substring(14);
}]);
</script>
</head>
<body ng-controller="AppCtrl">
<h1>Access Token</h1>
<p>{{accessToken}}</p>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20878335
复制相关文章
相似问题
腾讯云开发者
