根据外壳组件更改Angular router-outlet css？

Question

所以我有一个路由器插座，我用它来切换另一个组件一侧的组件。我希望能够根据封装的组件更改插座宽度。目前我正在使用共享服务来确定：

<div class="service.widthType">
  <router-outlet></router-outlet>
</div>

在组件之间，我正在更改共享服务属性以确定类，从而确定宽度：

ngOnInit() {
  this.service.widthType = "small" // Or "medium" or "large" depending on the component
}

这被认为是好的做法还是有更好的方法来做到这一点？

编辑：更正代码