所有以 app- 前缀开头的元素的 CSS 选择器

Question

我试图在我的 Angular 应用程序中定位所有以 app 为前缀的元素。有谁知道 SCSS 或普通 CSS 中以这种方式定位元素的方法吗？

请不要推荐使用像 [class^="app-"] 这样的类或属性定位，我尽量避免添加它们。

Answer 1

据我所知，在 css 中没有解决方案，但在 sass 中，您可以使用列表来存储组件名称并循环抛出列表并创建所需的选择器.

but with this way you have to add the components name manually

$component-list : 'home','admin' , 'other';
$prefix : 'app';


@each $c in $component-list {
  #{$prefix}-#{$c}{
   color:red;
  }
}

stackblitz demo