有没有办法在悬停时更改mat-checkbox的样式？

Question

我想更改hover上mat-checkbox的边框颜色。

下面的代码不起作用

::ng-deep .mat-checkbox:hover .mat-checkbox-frame:hover {
          border-color: red !important;
}

我的Stackblitz。请帮帮我。

Answer 1

设置（当您像在style.scss中一样全局设置样式时）

.mat-checkbox:hover {
  .mat-checkbox-frame {
    border-color: #ff2222 !important;//what ever color you want
  }
}

如果使用component-style.scss（例如标头组件，页脚等），则使用/deep/

 /deep/ .mat-checkbox:hover {
   /deep/ .mat-checkbox-frame {
     border-color: #ff2222 !important;//what ever color you want
   }
 }