Question

我在ionic2中使用ion-select。以下是我的代码：

       <ion-item>
            <ion-label>System Size:</ion-label>
            <ion-select [(ngModel)]="quoteDetailsUpdate.system_size" name="system">
                <ion-option value="1.5"> 1.5K </ion-option>
                <ion-option value="2"> 2K </ion-option>
                <ion-option value="3"> 3K </ion-option>
            </ion-select>
        </ion-item>

我想如果系统大小介于1.5和2之间，那么应该选择值1.5K。如果值为1.75则应选择1.5K选项。

Answer 1

此更改是否仅影响视图？如果是这种情况，您可以使用组件中的其他属性，如下所示：

public auxSystemSize: number;

...

constructor(...) {
    if(this.quoteDetailsUpdate.system_size > 1.5 && quoteDetailsUpdate.system_size < 2) {
        this.auxSystemSize = 1.5;
    } else {
        this.auxSystemSize = this.quoteDetailsUpdate.system_size;
    }
}

然后在视图中使用auxSystemSize

<ion-item>
    <ion-label>System Size:</ion-label>
    <ion-select [(ngModel)]="auxSystemSize" name="system">
        <ion-option value="1.5"> 1.5K </ion-option>
        <ion-option value="2"> 2K </ion-option>
        <ion-option value="3"> 3K </ion-option>
    </ion-select>
</ion-item>

这样quoteDetailsUpdate.system_size属性将保持其原始值。请注意，在提交表单时，您需要将auxSystemSize的值分配回模型（如果需要）。

* ngIf in ion-option in ionic 2

1 个答案: