如何将特定绑定传递给 Angular 1.5 中组件路由器引入的 ng-outlet 组件？

Question

我希望能够将参数传递给 ng-outlet 引入的子组件。但是我不知道该怎么做。

这是我的组件绑定的示例：

app.component('profile', {
  bindings: {
    section: '=',
    currentUser: '<'
  },
...

通常我会这样调用它：

<profile section="$ctrl.bio" current-user="$ctrl.selectedUser"></profile>

但是我有这个：

<ng-outlet></ng-outlet>

以及将配置文件传入的路由器。

 $routeConfig: [
        { path: '/Profile/:id', name: 'Profile', component: 'profile' }]

那么我如何将其他基本绑定（可能无法编码到 URL 中的绑定）传递给此组件？？

谢谢，非常感谢帮助

编辑：我被要求提供一个更具体的例子来说明我想做什么。

我认为概念上的问题已经很清楚了，但这里有一个特殊情况，传递路由参数显然是不够的。假设在我的 App 组件级别我有一个事件回调函数，onDeleteItem(id)

如何复制

bindings: {
    onDeleteItem: "&"
}

...

<some-component on-delete-item="$ctrl.onDeleteItem(id)"></some-component>

带 ng 插座？

Answer 1

我在 docs 上看到了路由器中使用的组件之一

bindings: { $router: '<' }

所以我在想，如果那个绑定可以被填充，那么为什么我们不能为其他绑定传递数据，但是我查看了组件路由器的源代码，实际上我没有看到以这种方式传递数据的方式。这是因为这里看起来是specially handling passing in the $router，但是我觉得之后模板没有修改：

activate(instruction) {
    ...
    this.controller.$$template = '<' + dashCase(componentName) + ' $router="::$$router"></' + dashCase(componentName) + '>';
    ...
};

不过我要说的是，您应该能够使用

将数据传递给组件

$routeConfig: [
    { path: '/Profile/:id', name: 'Profile', component: 'profile', data: { item1: 'item1'} }]

然后在组件的构造函数中注入 RouteData，但我认为这仅在 angular 2 中，因为我没有在 [=32= 中看到它的实现] 1个路由器。

所以根据我所做的研究，我认为你做不到，或者很难。另外，相关：How to inject data into Angular2 component created from a router and https://github.com/angular/angular/issues/4452

Answer 2

即使通过 ngOutlet，您也可以使用此处指定的 require 参数 https://docs.angularjs.org/guide/component 来要求父组件。这样子组件就可以和父组件通信了（虽然如此父组件通过ngOutlet调用子组件）。这使得来自 child => parent 的通信成为可能。关于 parent => child，你仍然可以使用相同的技术，即使感觉有点尴尬（你从 child 调用 parent 来获得你需要的东西......）。也许更标准的东西已经存在，或者即将实施。

如何将特定绑定传递给 Angular 1.5 中组件路由器引入的 ng-outlet 组件？

How do I pass specific bindings to ng-outlet components brought in by the component router in Angular 1.5?

router

components

angularjs