Angularjs

Question

我有一个 URL 这样的： http://myproject.com/apartments?location=123&arrival=01&departure=456&rooms=789

如何获取 location, arrival, departure, rooms 的值并将其传递给我的服务。

我尝试使用 $location.search() 但我无法获取值。结果： Object { location=undefined, arrival=undefined, departure=undefined, more...}

我的服务：

angular.module('apartmentService', [])

    .factory('Apartment', function ($http) {
        return {
            get: function (parameters) {

                console.log(parameters);

                return $http({
                    method: 'GET',
                    url: '/api/apartments',
                    params: {location: parameters}
                });
            }
        };
    });

我的控制器：

angular.module('apartmentCtrl', [])

    .controller('ApartmentController', function ($scope, $http, $location, Apartment) {
        $scope.loading = true;

        $scope.parameters = {
            location: $location.search().location,
            arrival: $location.search().arrival,
            departure: $location.search().departure,
            rooms: $location.search().rooms
        };

        Apartment.get($scope.parameters).success(function (data) {
            $scope.apartments = data;
            $scope.loading = false;
        });
    });

Answer 1

$location.search('queryparamname');

控制器内部注入服务 $location

参见参考资料

https://docs.angularjs.org/api/ng/service/$位置

// given url http://example.com/#/some/path?foo=bar&baz=xoxo
var searchObject = $location.search();
// => {foo: 'bar', baz: 'xoxo'}

// set foo to 'yipee'
$location.search('foo', 'yipee');
// $location.search() => {foo: 'yipee', baz: 'xoxo'}

Answer 2

您错误地映射了它们，以检索您执行的 queryStrings：

$location.search('arrival')
$location.search('location') 
// etc etc

但是你真的不需要映射它们... $location.search() returns 一个对象 (key/value) 的所有参数

$scope.parameters = $location.search();

// would return an object { location : '123', arrival : '555' /* etc etc */ }

Answer 3

使用ui-路由器。你会喜欢它，这是正确的方法！相信我！

这里有一个很好的例子 link - https://github.com/angular-ui/ui-router/wiki/URL-Routing

Answer 4

我猜这是因为 angular 需要 url 哈希之后的数据。

意味着如果 url 看起来像这样 $location.search 应该工作：http://myproject.com/#apartments?location=123&arrival=01&departure=456&rooms=789.

您可以尝试的一件事是让应用知道它的基础。将以下行添加到您的 html head 标记中。

<base href="/">

Answer 5

丑陋不安全的两行：

paramsObject = {};
window.location.search.replace(/\?/,'').split('&').map(function(o){ paramsObject[o.split('=')[0]]= o.split('=')[1]});

params 对象将是：

Object {location: "123", arrival: "01", departure: "456", rooms: "789"}

您可以将其直接注入您的 $scope.parameters

plunker here

Angularjs - 如何从 URL 获取参数

Angularjs - How can I get parameters from URL

javascript

parameters

url