Question

我有3个输入字段：marca（品牌），modelo（模型）和可燃（enginetype）。我最初需要modelo和combustible disabled，但是在选择品牌（marca）时设置为启用。

  <ion-item>
    <ion-label stacked>Marca</ion-label>
    <ion-select [(ngModel)]="marca" (ionChange)="getModelos($event, marca)" cancelText="Cancelar" placeholder="Selecciona una marca...">
      <ion-option *ngFor="let marca of marcas" value="{{marca.code}}">{{marca.name}}</ion-option>
    </ion-select>
  </ion-item>


  <ion-item>
    <ion-label stacked>Modelo</ion-label>
    <ion-select [(ngModel)]="modelo" (ionChange)="getVersiones($event, modelo, combustible)" cancelText="Cancelar" placeholder="Selecciona un modelo..." ng-disabled="!modelo">
      <ion-option value="" selected="true">Selecciona...</ion-option>
      <ion-option *ngFor="let modelo of modelos" value="{{modelo.code}}">{{modelo.name}}</ion-option>
    </ion-select>
  </ion-item>

<ion-item>
  <ion-label stacked>Combustible</ion-label>
  <ion-select [(ngModel)]="combustible" (ionChange)="itemTapped($event, combustible)" cancelText="Cancelar" placeholder="Selecciona una marca..." disabled>
    <ion-option value="" selected="true">Selecciona...</ion-option>
    <ion-option *ngFor="let combustible of combustibles" value="{{combustible.code}}">{{combustible.value}}</ion-option>
  </ion-select>
</ion-item>

Answer 1

您可以使用ion-select和“marca”模型的“disabled”属性来实现：

<ion-item>
    <ion-label stacked>Marca</ion-label>
    <ion-select [(ngModel)]="marca" (ionChange)="getModelos($event, marca)" cancelText="Cancelar" placeholder="Selecciona una marca...">
      <ion-option *ngFor="let marca of marcas" value="{{marca.code}}">{{marca.name}}</ion-option>
    </ion-select>
  </ion-item>


  <ion-item>
    <ion-label stacked>Modelo</ion-label>
    <ion-select [disabled]="marca" [(ngModel)]="modelo" (ionChange)="getVersiones($event, modelo, combustible)" cancelText="Cancelar" placeholder="Selecciona un modelo...">
      <ion-option value="" selected="true">Selecciona...</ion-option>
      <ion-option *ngFor="let modelo of modelos" value="{{modelo.code}}">{{modelo.name}}</ion-option>
    </ion-select>
  </ion-item>

<ion-item>
  <ion-label stacked>Combustible</ion-label>
  <ion-select [disabled]="marca" [(ngModel)]="combustible" (ionChange)="itemTapped($event, combustible)" cancelText="Cancelar" placeholder="Selecciona una marca...">
    <ion-option value="" selected="true">Selecciona...</ion-option>
    <ion-option *ngFor="let combustible of combustibles" value="{{combustible.code}}">{{combustible.value}}</ion-option>
  </ion-select>
</ion-item>

如何在Ionic2中设置启用的输入

1 个答案: