ui-router通过服务将URL查询参数传递给控制器​​ - $ stateParams值＆＃39; undefined＆＃39;

Question

使用ui-router并尝试将URL查询参数传递给模块的.config中的控制器，使用已注入.service resolve参数的.state {1}}定义。

首选方法 - （无法可靠运行）

.state('list', {
    url: '/list?country&state&city',
    templateUrl: "list.html",
    controller : 'myController',
    resolve: {
          currentUrlTypeParam : ['myServices', function(myServices){        // object variable that can be injected into specified controller
              return myServices.getUrlTypeParams();
            }]
        }
  })

虽然文档说只有Constant和Provider配方可以注入模块的.config函数，但我遵循.state定义的this method of injecting a .service into the resolve argument。

我使用服务的原因是我有许多具有相同URL查询参数的状态 - 因此将函数编写为服务提供者而不是重复它是有意义的。

我使用resolve而不是直接将$stateParams注入控制器，这样我就可以在配置期间完成服务器调用。

Here's a plunker这个（显示具有相同网址参数的3种可能状态） - 但它无法可靠地工作 - 正确的URL参数似乎在第二次点击时到达同一个网址中的不同网址州。

更令人沮丧的是$stateParams似乎在.service函数中正确到达（第一次点击） - 但在尝试访问它们时，值会显示为undefined - 看看这个奇怪的现象！{/ 1>}看看这个奇怪的现象！{/ p>

例如
console.log会在console.log函数中输出$stateParams作为：
.service
但是当我在函数中调用{country: "US", state: undefined, city: undefined}时，我得到$stateParams.country ??

替代梅西耶方法 - （正常工作）

替代方法是在每个状态定义的undefined参数中重复相同的大.service代码 - 这可以正常工作，但会使代码膨胀（...和此是我正在处理的状态/参数的简化示例。）

resolve

请参阅this plunker，了解实现相同目标的一种相当......不太优雅的方式。

Answer 1

您的服务不起作用的原因是您尝试注入$stateParams，而不是将其传递到服务功能本身。

不要将$stateParams注入您的服务并运行return myServices.getUrlTypeParams();，而是尝试将$stateParams传递到您的服务功能中。例如：

resolve: {
    currentUrlTypeParam : ['$stateParams', 'myServices', function($stateParams, myServices){        // object variable that can be injected into specified controller
        return myServices.getUrlTypeParams($stateParams);
    }]
}

然后，您必须将服务修改为不注入$stateParams，而是将其传递到您的服务功能中：

this.getUrlTypeParams = function($stateParams){ ... }