Question

我正在努力解决下一个问题。我试图在PROPER路上改变角度材料2 radio button的颜色，而不是覆盖css。默认情况下，它使用材质主题的强调颜色，但我想使用主要颜色。

其他组件具有颜色属性，如checkbox，button等......

提前致谢。

Answer 1

如果其他人遇到此问题，您现在可以在MatRadioButton组件上使用color属性。以下是我更正的GitHub问题的链接：

https://github.com/angular/material2/issues/9439

Answer 2

单选按钮组件没有用于更改颜色的输入。您需要在.scss文件中添加以下行：

/deep/ .mat-radio-outer-circle {
.mat-radio-checked & {
      border-color: #3f51b5;
    }
}

/deep/ .mat-radio-inner-circle {
    background-color: #3f51b5;
}

/deep/ .mat-radio-ripple .mat-ripple-element {
    background-color: rgba(#3f51b5, 0.26);
}

Answer 3

ng-deep被描述。将此代码复制到您的styles.scss文件中。它将起作用。

const country = "Australia/Sydney"

function timezone_offset_min(country: string) {
  const local_d = new Date()
  const remote_str = local_d.toLocaleString("en-US", { timeZone: country })
  const local_ms = local_d.getTime()
  const remote_ms = (new Date(remote_str)).getTime()
  const local_remote_offset = Math.round((local_ms - remote_ms) / (60 * 1000))
  const local_offset = new Date().getTimezoneOffset()
  return local_remote_offset + local_offset
}

console.log(timezone_offset_min(country))

Answer 4

这是对我有用的

.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle , .mat-radio-outer-circle {
  border-color: blue !important;
}

.mat-radio-button.mat-accent .mat-radio-inner-circle{
  background-color: blue !important;
}

如何改变角度材料中单选按钮的颜色2

4 个答案: