从属性类型指令(不是组件)访问ui-router状态参数

时间:2017-09-13 20:33:31

标签: angularjs angular-ui-router

我们正在从一个非常旧版本的UI路由器升级到v1.0.5,我在尝试替换已弃用的$ stateParams时遇到了问题。要使用简化示例,我们在表单字段上使用unique-name属性类型指令进行验证检查,以确保字段中的文本是唯一名称。我们的想法是添加新的doohickey或更改现有doohickey的名称,我们希望确保没有其他doohickey具有相同的名称。

在我们的旧代码中,我们可以像doohickeyId这样获得$stateParams值:

function uniqueName(doohickeySearchService, $stateParams, $q) {
        return {
            restrict: 'A',
            require: 'ngModel',
            link: function (scope, elm, attrs, ctrl) {
                ctrl.$asyncValidators.uniqueName = function (modelValue) {
                    // use doohickeySearchService to look up foundDoohickey by name
                    // then...
                    return foundDoohickey.id !== $stateParams.doohickeyId;
                };
            }
        };
    }

可能过度简化,但问题的核心在于:如何在不使用已弃用的doohickeyId的情况下访问$stateParams值?有一个父状态是从状态定义中指定的url获取它,类似于/doohickey/{doohickeyId:int}/edit

我可以使用$state获取$current状态,以及path属性中的状态数组,我甚至可以在其中一个状态中看到doohickeyId参数路上的国家。不幸的是,如果我使用param的value(),它会返回undefined,即使$stateParams具有正确的doohickeyId值。我也尝试在父状态上添加doohickeyId作为解析,但不幸的是,这并没有给我任何关于属性类型指令的数据。

阅读文档和谷歌搜索引用了从子状态或组件访问父数据的引用,但我试图从属性类型指令获取访问权限,而不是状态/零件。有没有办法在不给我们的代码库进行重大改革的情况下做到这一点?

3 个答案:

答案 0 :(得分:1)

您是否尝试过UI-Router文档中的此解决方案?

  

而不是使用全局$ stateParams服务对象,

     

注入$ uiRouterGlobals并使用UIRouterGlobals.params

MyService.$inject = ['$uiRouterGlobals'];
function MyService($uiRouterGlobals) {
  return {
    paramValues: function () {
      return $uiRouterGlobals.params;
    }
  }
}
     

而不是使用每个转换的$ stateParams对象,

     

注入当前Transition(作为$ transition $)并使用Transition.params

MyController.$inject = ['$transition$'];
function MyController($transition$) {
  var username = $transition$.params().username;
  // .. do something with username
}

https://ui-router.github.io/ng1/docs/latest/modules/injectables.html#_stateparams

答案 1 :(得分:0)

将数据作为attribute-type指令的值传递。然后通过链接函数中的attrs参数检索它。然后将其与范围进行评估。

<input unique-name="{doohickeyId: doohickeyIdFromStateParams}" />

link: function (scope, elm, attrs) {
    var data = scope.$eval(attrs.uniqueName));

    console.log('My doohickey ID is: ', data.doohickeyId);

}

答案 2 :(得分:0)

我发现离线答案,但我想在此发布以供将来参考。我们决定采用的方法是建立我们自己的自定义全局状态服务来保存状态参数。所以在app/app.js我们在app.run()

中得到了类似的内容
$transitions.onFinish({}, function ($transition$) {
    customStateService.setCurrentStateParams($transition$);
});

然后我们可以在我们需要的任何地方注入customStateService,并调用getCurrentStateParams()函数来检索最近成功状态转换中可用的任何参数,类似于我们之前使用的$stateParams re 1}}。