web-dev-qa-db-ja.com

Angularjsでハッシュ後にURLパラメータを解析するにはどうすればよいですか？

URLが次のようなFoursquareからaccess_tokenを解析しようとしています。

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: '/'
    });
});
javascriptangularjsurlfoursquareangularjs-routing
21
padawanlvn

From 角度位置情報サービス$location.hash()メソッドは_#after-hash_を返します

あなたのURLが次のように見える場合

_https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX
_

それから

$location.hash() return _access_token=1234567890XXXXX_

split('=')[1]に分割する必要があります

これを参照してください plunker _4Square_をクリックしてから$location.url() return

_/4sqredirect/#access_token=123456
$location.hash().split('=')[1]
_

return _123456_

38
Reza

$location.search()を使用します

//e.g. url https://www.example.com/#!?name=123
var s = $location.search();
// {name: '123'}

http://docs.angularjs.org/api/ng 。$ location

サーチ：

パラメータなしで呼び出された場合、現在のURLの検索部分を（オブジェクトとして）返します。

8
Umur Kontacı

私はそれを行うための「ネイティブな角度」の方法を知りませんが、文字列型としてlocation.hash経由でハッシュにアクセスできます。おそらく理想的ではありませんが、実行可能です。

0
Stuart Nelson

実際には、これを行うための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>
0
Moritz Petersen