Ui-Router 使 $promise 数据可用于 child 没有控制器的状态视图

Question

如果我有一个带控制器的 parent 路由和一个没有控制器的 child 路由，那么 children 不应该看到 $scope来自 parent.

的数据

.state('parent', {
  url: '/parent/{idParentRecord}?extraInfo',
  templateUrl: 'app/parent/parent.html',
  controller: 'ParentController',
  controllerAs: 'aparent'
})
.state('parent.child', {
  url: '/child/{idChild}',
  templateUrl: 'app/parent/child.html'
})

然后我可以只访问 parent $scope 中的属性吗，就好像它们在 child 范围中一样，所以在 child 视图中我可以吗说：
```
<h1>{{name}}</h1>
```

假设 $scope.name 在 ParentController 的 $scope 中有一个值？

如果是这样，并且控制器正在加载一些缓慢的数据，当 parent $scope.data.subdata.mydata 最终加载时，如果我有
```
<p>{{data.subdata.mydata}}</p>
```

在我的 Controller-less parent.child 状态视图中，它应该只在数据加载时显示...对吗？即使也许我正在要求基于我的 child 状态的东西，比如调用 $scope.myfunc(idChild) 为我过滤一个数组，比如

    <div ng-repeat="myparticle in getMyParticles($stateParams.idChild)">
      <p>{{myparticle.aproperty}}</p>

感谢您的帮助！

Answer 1

是的，只要您的子视图嵌套在父视图中，您的想法就是正确的。如果您的状态视图是嵌套的，范围属性将仅沿状态链向下继承。

有关详细信息，请参阅 ui-router wiki 部分 Scope Inheritance by View Hierarchy Only。

我在 plunker 中制作了一个 quick 演示，您可以看到： http://plnkr.co/edit/0EOdaXIiJhhoKElQnHfo?p=preview

州：

angular
  .module('app', ['ui.router'])
  .config(function ($stateProvider) {
     $stateProvider
        .state('parent', {
            url: '/parent',
            templateUrl: 'parent.html',
            controller: 'ParentController',
            controllerAs: 'aparent'
        })
        .state('parent.child', {
            url: '/child',
            templateUrl: 'child.html'
        });
  })
  .controller('ParentController', function () {
      var vm = this;

      vm.name = 'Test Name';
  });

parent.html:

<!-- Parent View -->
<h2>Parent View</h2>

<!-- This is where the child view will show -->
<ui-view></ui-view>

child.html

<!-- Child View -->
<h2>Child View</h2>

{{aparent.name}}

Ui-Router 使 $promise 数据可用于 child 没有控制器的状态视图

Ui-Router make $promise data available to child state view with no controller

parent-child

angularjs

angular-ui-router