我正在嘗試使用angular material構建一個網頁 其中我有一個下拉選擇元素和一堆FAB按鈕來顯示狀態。 我想做的是,如果點擊下拉串列并選擇一個專案。 按鈕的背景顏色將根據我選擇的專案而改變。
我已經找到了一些解決方案,可以根據按鈕點擊事件來改變顏色(方案)。 有沒有一種方法可以根據下拉串列的選擇來觸發背景顏色的變化?
謝謝你
uj5u.com熱心網友回復:
你可以使用以下代碼觸發函式,在每次選擇的專案被改變時改變按鈕的顏色:
<mat-select (selectionChange)="setButtonColor($event.value)"/span>
name="color" formControlName="type" >
<mat-option *ngFor="let color of colors"/span>
[value]="color">{{type}}。
</mat-option>/span>
</mat-select>
<button mat-button [ngStyle]="{'background-color': bgColor}">
鈕扣
</button>/span>
你的Typescript檔案應該包含一個變數bgColor來保存選擇的值字串,以及改變這個變數值的setButtonColor函式
bgColor = 'blue'; // blue is the default color in this case。
setButtonColor(color){
bgColor = color。
}
uj5u.com熱心網友回復:
Angular Mat Select Multiple selectionchange查找哪個選項被改變
上述問題的答案幫助了我。 https://stackblitz.com/edit/angular-1e9gsd-34hrwg?file=app/select-overview-example.html 我根據上面顯示的代碼調整了我的代碼,結果都成功了。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/321018.html
標籤:
