我正在將我的應用程序遷移到Angular 16和Material，并替換不再受支持的flex-layout。

我也在用scss重構css，但是我再次面臨類風格評估順序的問題，我不想用& quot重要& quot再也不會了。

不幸的是，Angular仍然把它的風格放在我的風格之后。

在我的angular.json中，我有這樣一個序列:

[
 "./node_modules/@mdi/font/css/materialdesignicons.min.css",
 "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
 "src/styles.scss",
 "src/darkmode.scss"
]

例如，我有一個材質-圖標-按鈕。

<button mat-icon-button class="add-button">
 ...
</button>

在運行時，Angular將其轉換為:

<button _ngcontent-ng-c4190991567="" mat-icon-button="" class="add-button mdc-icon-button mat-mdc-icon-button mat-unthemed mat-mdc-button-base"><span class="mat-mdc-button-persistent-ripple mdc-icon-button__ripple"></span>
 ...
</button>

我放在add-button類中的任何樣式都被所有mdc*類覆蓋，正如你從圖片中看到的那樣。

我知道::ng-deep等...已被否決。

那么，我怎樣才能讓我的職業戰勝實時風格呢？

謝了。