Question

我这里有一个棘手的情况。我的父状态和子状态都覆盖了顶层的相同ui视图（index.html）。所以当它从父级进入子状态时，范围会被破坏（我认为？）基本上父级有一个存储在MetricData属性中的解析，我似乎无法从子级访问它，因为它没有嵌套我假设。有没有办法在子节点中获取该metricdata属性，而无需在子节点中再次手动调用相同的ajax调用

父州

     .state("home.metric", {
      url: "/category/:categoryId/metric/:metricId/name/:metricName",
      views: {

        'main@': {

          templateUrl:
            function (stateParams){
              //move this to a util function later
              var tempName = unescape(stateParams.metricName);
              tempName = tempName.replace(/\s/g, "-");

              return '../partials/slides/' + tempName + '.html';
            },
          resolve: {
            MetricData: ['MetricService', '$stateParams', 
              function(MetricService,    $stateParams){
                var data = { categoryId : $stateParams.categoryId, metricId : $stateParams.metricId};
                return MetricService.getMetricDetails(data);
              }]
          },
          controllerProvider: 
            function ($stateParams) {
              var tempName = unescape($stateParams.metricName);
              tempName = tempName.replace(/\s+/g, '');

              return tempName + 'Ctrl';
            }
        }
      }

    })

儿童状态

.state("home.metric.detail", {
      url: "/detailId/:detailId/detailName/:detailName",
      views: {

        'main@': {
          templateUrl:
            function ($stateParams){
              //move this to a util function later
              var tempName = unescape($stateParams.detailName);
              tempName = tempName.replace(/\s/g, "-");

              return '../partials/slides/' + tempName + '.html';
            },
          resolve: {
            DetailData: ['DetailService', '$stateParams',
              function(DetailService,      $stateParams){
                var data = { categoryId : $stateParams.categoryId, detailId : $stateParams.detailId};
                return DetailService.getDetails(data);
              }],
            // MetricData: ['MetricService', '$stateParams', 
            //   function(MetricService,    $stateParams){
            //     var data = { categoryId : $stateParams.categoryId, metricId : $stateParams.metricId};
            //     return MetricService.getMetricDetails(data);
            //   }]
          },
          controllerProvider: 
            function ($stateParams) {
              var tempName = unescape($stateParams.detailName);
              tempName = tempName.replace(/\s+/g, '');

              return tempName + 'Ctrl';
            }
        }

      }

    })

Answer 1

我。问题的答案：

... 孩子，因为没有嵌套 ...有没有办法在子项中获取该metricdata属性？

基于

What Do Child States Inherit From Parent States?

子状态DO从父状态继承以下内容：


通过解决方案解决了依赖关系

自定义数据属性


继承了其他任何东西（没有控制器，模板，网址等）。

与

结合

Scope Inheritance by View Hierarchy Only

请记住，只有当状态的视图嵌套时，范围属性才会继承状态链。范围属性的继承与状态的嵌套无关，而与事物有关嵌套视图（模板）。

完全有可能您有嵌套状态，其模板在您网站的各种非嵌套位置中填充ui-views。在这种情况下，您不能指望在子状态视图中访问父状态视图的范围变量。

II。 虽然现在应该清楚，我们仍然需要找到一种方法解决：

... 有没有办法在子项中获取该metricdata属性，而无需在子项中再次手动调用相同的ajax ...

我想说，也有答案。 E.g。

..将共享视图/解析器移动到最小公分母。 ..

E.g。我们可以像在这个Q＆amp;答：Controlling order of operations with services and controllers，请参阅plunker：

一个特殊的祖父/根州：

$stateProvider
  .state('root', {
    abstract : true,
    // see controller def below
    controller : 'RootCtrl',
    // this is template, discussed below - very important
    template: '<div ui-view></div>',
    // resolve used only once, but for available for all child states
    resolve: {
      user: function (authService) {
          return authService.getUserDetails();
      }
    }
  })

将已解析的内容传递到$ scope（由每个子级继承）

.controller('RootCtrl', function($scope,user){
  $scope.user = user;
})

这是在我们的州/视图层次结构中注入的，任何子状态都可以从中获利

// any previously root state will just use the above as a parent
.state('index', {
    url: '/',
    parent : 'root',

查看更多详细信息here并在working example

中查看

如何在ui-router中继承解析数据

1 个答案:

What Do Child States Inherit From Parent States?

Scope Inheritance by View Hierarchy Only