如何在路由器插座创建组件元素时将css类应用于组件元素？

关键是/ deep / keyword:

    :host /deep/ router-outlet + project {
        display: block;
        border: 10px solid black;
    }

无需任何额外配置即可使用.

:host /deep/ router-outlet + * 对于由Angular Router动态创建的任何组件.

编辑2018/3/5:

由于Angular 4.3.0被/deep/弃用,其建议的替代方案是::ng-deep.关于此问题进行了长时间的讨论.

使用adjacent sibling selector和*通配符选择紧随在之后的元素router-outlet

styles.css

router-outlet + * {
  /* your css */
}