Question

我使用离子3并试图改变背景色离子选择。

html文件：

        <ion-select   [class.disabledField]="disabledVar" disabled="{{disabledVar}}"  [(ngModel)]="dataModel">
            <ion-option *ngFor="let item of lists" value="{{item.id_str}}">{{item.text}}</ion-option>
          </ion-select>

scss文件：

 .disabledField { 
        background-color:#d7d7d7;
    }

背景颜色无法改变。但不知何故，这个代码没有离子输入和离子日期时间的问题。这个问题只有离子选择。

如果有人可以帮助我，我真的很感激。

谢谢。

Answer 1

我认为你想调整禁用选择的外观，所以也许

ion-select[disabled] {  
    background-color:#d7d7d7; 
    /*you can optionally add !important*/
}

或者反过来，使用[ngClass]：

<ion-select [ngClass]="'disabledField': disabledVar === true"...

Answer 2

问题解决

.item-select-disabled ion-label,ion-datetime {
        opacity: 100;
        color:#000;
        font-size: $font-size-field;
    }


    .disabledField { 
        opacity: 100;
        background-color:#d7d7d7;
    }

    .select-disabled {  
        opacity: 100;
        background-color:#d7d7d7 !important; 
        /*you can optionally add !important*/
    }

 <ion-select   [class.disabledField]="disabledVar" disabled="{{disabledVar}}"  [(ngModel)]="dataModel">
            <ion-option *ngFor="let item of lists" value="{{item.id_str}}">{{item.text}}</ion-option>
          </ion-select

离子离子选择动力学类

2 个答案: