32

我在一个应用程序中使用 angular,它基本上是一个带有搜索结果的表。可以通过类似的 url 访问此表http://myapp/?client=clientName

为表格实例化一个角度控制器,除其他外,用于打开带有行详细信息的模态对话框(也是基于角度的 bootstrap-ui)。

这些行细节是通过一个服务带来的,该服务对两个控制器都有一些共同的功能:一个用于表格,一个用于模式。

现在,在此服务中,我有以下片段要检索:

service.fetchRelatedElements = function(element, cb) {
  var url = '/search.json?results=20&type='+element.type;
  if ($location.search()['client']) {
    url += '&client=' + $location.search('client');
  }
  return doFetch(url, cb); // actual server json GET
};

目标是了解表是否已经将此特定client参数集设置为过滤器。

如果我在此调用的开头放置一个断点,我会看到它$location.absUrl()返回当前浏览器 URL(在我的例子中,它具有client我感兴趣的参数)。

$location.search()返回一个空对象。

我在我的服务中使用默认值注入 $location 服务(也就是说,不是通过.config()调用来配置它)。而且,正如医生所说:

$location 服务解析浏览器地址栏中的 URL(基于 window.location)并使 URL 可用于您的应用程序。

我错过了什么吗?此时不应该解析 URL 吗?

谢谢!


更新:我设法使它工作。问题正是我根本没有配置服务。我这样做是因为我认为这样会采用默认值,但似乎这不是它的工作方式。

4

5 回答 5

43

$locationProvider在我的应用程序模块配置中进行配置之前,我遇到了同样的问题:

appModule.config(['$locationProvider', function($locationProvider) {
        $locationProvider.html5Mode(true);
    }]);
于 2013-10-18T01:44:22.100 回答
12

如果不想指定base标签,可以指定require base false。

myapp.config(function($locationProvider) {
    $locationProvider.html5Mode({
      enabled: true,
      requireBase: false
    });
});
于 2015-06-15T23:17:21.430 回答
5

当我遇到这个问题时,除了设置配置之外对我有用的另一件事是在查询字符串前面添加“#”。

因此,如果您是创建查询字符串的人,则更
myapp/?client=clientName
改为
myapp/#?client=clientName

允许 $location.search() 给我一个非空对象,然后您可以使用它访问每个参数$location.search()['client']

于 2015-02-20T21:35:25.477 回答
4

$location.search 的 API 相当混乱。打电话

$location.search('client');

将搜索对象设置为 {client: true} 并返回 $location。此外,您有一个错字client而不是'client',因此它将搜索设置为一个空对象。所以你可能想要:

url += '&client=' + $location.search()['client'];
于 2013-04-29T21:57:54.333 回答
3

您可以根据此评论编写一个解析 $window.location.search 的函数https://github.com/angular/angular.js/issues/7239#issuecomment-42047533

function parseLocation(location) {
    var pairs = location.substring(1).split("&");
    var obj = {};
    var pair;
    var i;

    for (i in pairs) {
        if (pairs[i] === "")
            continue;

        pair = pairs[i].split("=");
        obj[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
    }

    return obj;
}

$scope.query = parseLocation($window.location.search)['query'];
于 2014-10-21T04:07:40.130 回答