我可以使用一些建议如何处理我面临的这个问题。为了向您解释这一点,我创建了一个主要组件:
ApplicationRunner
此组件从api中检索预订并将其保存在您看到的预订对象中(它有一种类似预订的类型)
@Configuration
当我点击Passenger按钮时,它将重定向到乘客页面Main / passenger,但是在这里我需要发送预订对象(整个)或PassengerList(数组)。
是否可以通过路径参数或路由器插座来知道是否可以这样做?有什么建议吗?
答案 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
是有意义的。