角度2可以通过路线参数传递物体吗?

时间:2016-02-18 10:34:12

标签: angular angular2-routing

我可以使用一些建议如何处理我面临的这个问题。为了向您解释这一点,我创建了一个主要组件:

ApplicationRunner

此组件从api中检索预订并将其保存在您看到的预订对象中(它有一种类似预订的类型)

@Configuration

当我点击Passenger按钮时,它将重定向到乘客页面Main / passenger,但是在这里我需要发送预订对象(整个)或PassengerList(数组)。

是否可以通过路径参数或路由器插座来知道是否可以这样做?有什么建议吗?

1 个答案:

答案 0 :(得分:34)

只需使用共享服务并将其添加到父组件的providers: [...]

简单服务类

@Injectable()
export class ReservationService {
  reservation:Reservation;
}

在父级中将其添加到提供程序并将其注入构造函数

@Component({...
   providers: [ReservationService]
export class Parent {
  constructor(private reservationService:ReservationService) {}

  someFunction() {
    reservationService.reservation = someValue;
  }
}

在子组件中只注入它(不要添加到提供者)

@Component({...
  providers: []
export class Passenger {
  constructor(private reservationService:ReservationService) {
    console.log(reservationService.reservation);
  }

  someFunction() { 
    reservationService.reservation = someValue;
  }
}

<强>更新

bootstrap()是一切的共同祖先和有效的选择。这取决于您的具体要求。如果在组件上提供它,则此组件将成为共享单个实例的树的根。这样您就可以指定服务的范围。如果范围应该是&#34;您的整个申请&#34;然后在bootstrap()或根组件中提供它。 Angular2样式指南鼓励支持providers的根组件bootstrap()。结果将是相同的。如果您只想在组件A与添加到其<router-outlet>的其他组件之间进行通信,那么将范围限制为此组件A是有意义的。