Question

我有这样的网址： 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

丑陋不安全的双线：

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

paramsObject将是：

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

您可以直接注入$ scope.parameters

plunker here

Answer 2

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

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

但你真的不需要映射它们... $ location.search（）返回所有参数的对象（键/值）

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

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

Answer 3

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

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

Answer 4

$ location.search（＆＃39; queryparamname＆＃39）;

控制器内部注入服务$ 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 5

我猜这是因为angular正在期待url hash之后的数据。

如果网址如下所示$location.search应该有效：http://myproject.com/#apartments?location=123&arrival=01&departure=456&rooms=789。

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

<base href="/">

Angularjs - 如何从URL获取参数

5 个答案: