Как поменять курсор на мат-радио-кнопку?

Question

У меня есть этот мат-радио-кнопка. Когда эта опция отключена, я хотел бы сделать курсор без пропуска .

<mat-radio-button _ngcontent-c11="" class="mat-radio-button mat-accent b-disabled-radio 
  mat-radio-disabled" value="option['text']" ng-reflect-checked="false" 
  ng-reflect-value="option['text']" ng-reflect-disabled="true" tabindex="-1" 
  id="mat-radio-12">
  <label class="mat-radio-label" for="mat-radio-12-input">
    <div class="mat-radio-container">
        <div class="mat-radio-outer-circle"></div>
        <div class="mat-radio-inner-circle"></div>
    </div>
  </label>
</mat-radio-button>

Используя Chrome DevTools, когда я изменяю значение этого правила со значения по умолчанию на нет-Потом, это работает, то есть я вижу изменение курсора.

.mat-radio-disabled, .mat-radio-disabled .mat-radio-label {
     cursor: default; //==> no-drop
 }

Однако, когда я копирую / вставляю правило в myComponent.Component.css, ничего не происходит.

Спасибо за помощь

Answer 1

Это работает, если вы поместите ваши стили в глобальную таблицу стилей: https://stackblitz.com/edit/angular-mu68jp
Добавьте следующий код в ваши глобальные стили ( styles.css ):

app-my-component {
  .mat-radio-disabled, .mat-radio-disabled .mat-radio-label {
     cursor: no-drop !important;
  }
}