Question

我有一个通过路由加载的组件，我正在尝试将数据从父组件传递到组件中。我该怎么做呢？

父组件类

export class HomeComponent{
    userName: string;
    userId: string;

    ngOnInit(): void{
        this.userName = "user name";
        this.userId = "user id";
    }
}

父组件模板

<div>
    <p>Parent Component</p>
</div>
<router-outlet></router-outlet>

子组件类

export class ChildComponent{
    userName: string;
    userId: string;
}

基本上，home组件具有仅对该组件可用的子路由。子组件与父组件一起自动加载，但我想在子组件内使用父组件中的数据。出于实用目的而没有对我的应用程序是否设置正确的问题，它是。

Answer 1

如果您愿意，可以通过路由器传递变量，例如。

customerId

然后您可以通过ActivatedRouteSnapshot

访问

class ChildComponent
{
  constructor(route : ActivatedRouteSnapshot)
  {
    const customerId = +route.params["customerId"];
  }
}

例如

run VSS.init()

Answer 2

提供具有被动数据的服务是最佳解决方案。

使用Angular2将数据传递到路由组件

2 个答案: