我正在使用 Angular 1.5 组件路由器,并且无法在父组件中获取范围变量以在子组件中访问。我在这里创建了一个plunker 来说明这个问题。我用这个视图创建了一个父组件:
<nav>
<ul class="linkList">
<li><a ng-class="{selected: $ctrl.isSelected('Applications')}" ng-link="['Applications', {search:$ctrl.search}]">Applications</a></li>
<li><a ng-class="{selected: $ctrl.isSelected('Processes')}" ng-link="['Processes']">Processes</a></li>
<li><a ng-class="{selected: $ctrl.isSelected('Tasks')}" ng-link="['Tasks']">Tasks</a></li>
<li><a ng-class="{selected: $ctrl.isSelected('Resources')}" ng-link="['Resources']">Resources</a></li>
</ul>
<div class="filter">
Filter: <input type="search" ng-model="$ctrl.search" />
</div>
<div class="clear"></div>
</nav>
<ng-outlet></ng-outlet>
注意父组件视图中的“搜索”变量。我希望子组件可以访问它,但它对我不起作用。我已经看到了一些示例,这些示例显示子组件在父组件中被直接引用,如下所示:
<application-grid search="$ctrl.search"></application-grid>
但是,这不是违背了 ng-outlet 的目的吗?我认为我不应该像这样手动将参数传递给子组件吗?这样做的正确方法是什么?