Angular 劍道網格：所選行的背景顏色

Question

如何更改選中的劍道 Angular 網格行的背景顏色？ 以下不是使背景顏色變藍。 試圖找出壓倒它的東西。

.k-grid .k-state-selected  {
  background-color: blue !important;
  color: green;
}
 
.k-grid .k-alt.k-state-selected {
  background-color: blue !important;
  color: green;
}

資源： https://www.telerik.com/forums/changeing-color-of-selected-row

Answer 1

由於視圖封裝，您的樣式不會影響網格。 你可以在這里閱讀更多關於它的信息。

要強制將自定義樣式用於具有視圖封裝的子組件（默認情況下所有組件都設置為 Emulated），請在Emulated選擇器之前添加::ng-deep ，如下所示：

:host ::ng-deep .k-grid .k-state-selected  {
    background-color: blue !important;
    color: green;
}
  
:host ::ng-deep .k-grid .k-alt.k-state-selected {
    background-color: blue !important;
    color: green;
}

由於::ng-deep將樣式轉換為全局規則，因此您需要在它之前添加:host以便它只影響當前組件及其子組件。

請注意::ng-deep已棄用，從技術上講不應使用。 計划進行替換，並且::ng-deep可能會出現，直到他們想出其他東西。

您可以在此處閱讀更多關於::ng-deep信息。