2016-11-05 2 views
0

Попробуйте следующий HTML:Ionic2 не отключит контроль формы

<ion-content class="home"> 

    <ion-list> 
    <form [formGroup]="consoleTypeForm"> 
     <ion-item> 
     <ion-label>Gaming</ion-label> 
     <ion-select FormControlName="consoleType" (ionChange)="printSV($event)"> 
      <ion-option value="nes">NES</ion-option> 
      <ion-option value="n64">Nintendo64</ion-option> 
      <ion-option value="ps">PlayStation</ion-option> 
      <ion-option value="genesis">Sega Genesis</ion-option> 
      <ion-option value="saturn">Sega Saturn</ion-option> 
      <ion-option value="snes">SNES</ion-option> 
     </ion-select> 
     </ion-item> 
     <ion-item> 
     <ion-label stacked>Business Name</ion-label> 
     <ion-input formControlName="myConsole" type="text"></ion-input> 
     </ion-item> 
    </form> 
</ion-list> 

</ion-content> 

С следующий класс контроллера:

import { Component } from '@angular/core'; 
import { NavController, MenuController } from 'ionic-angular'; 
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; 

@Component({ 
    templateUrl: 'home.html' 
}) 
export class HomePage { 
    consoleTypeForm: FormGroup; 

    constructor(public nav: NavController, 
       public menu: MenuController, 
       public formBuilder: FormBuilder) { 
    this.consoleTypeForm = formBuilder.group({ 
     consoleType: ['', Validators.required], 
     myConsole: [''] 
    }); 
    } 

    printSV(value) 
    { 
    const ctrl = this.consoleTypeForm.controls['consoleType']; 
    const ctrlToBeDisabled = this.consoleTypeForm.controls['myConsole']; 

    ctrlToBeDisabled.enable(false); 
    ctrlToBeDisabled.disable({ onlySelf: true }); 
    ctrlToBeDisabled.disable(true); 
    ctrlToBeDisabled.disable(); 
    } 
} 

Ни один из вариантов не отключить работу 'myConsole'. Может кто-нибудь, пожалуйста, укажет на ошибку? или, это большой?

Ионные Framework версия: 2.0.0-РК-2, Ионные CLI версия: 2.1.0 Ионные App Lib Версия: 2.1.0-beta.1

ответ

0

Я не выполнил код, но от чтения я указываю по крайней мере 2 вещи:

FormControlName="consoleType" следует читать formControlName="consoleType"

Я бы место создания FormGroup в ionViewDidLoad() метод жизненного цикла:

ionViewDidLoad() { 
    this.consoleTypeForm = formBuilder.group({ 
    consoleType: ['', Validators.required], 
    myConsole: [''] 
    }); 
} 

Я не знаю, вызывает ли это проблемы в конструкторе, но я прочитал пример кода и для меня он работает.

Тип определение AbstractControl имеет следующий метод, чтобы отключить контроль:

/** 
* Disables the control. This means the control will be exempt from validation checks and 
* excluded from the aggregate value of any parent. Its status is `DISABLED`. 
* 
* If the control has children, all children will be disabled to maintain the model. 
*/ 
disable({onlySelf, emitEvent}?: { 
    onlySelf?: boolean; 
    emitEvent?: boolean; 
}): void; 

Из того, что я хотел бы попробовать отключить с:

control.disable(); 

или

control.disable({onlySelf: true}); 

Скажите мне, помогло ли это, и в случае создания Plunkr, чтобы мы могли поиграть с вашим кодом.

Смежные вопросы