Question

我有两个问题： 1：验证要求仅显示我是否在字段中单击2次，在第一次显示有效，并在第二次显示具有ng-invalid类的无效字段（正确但在第一次模糊的字段事件中显示）。 /> 2：我正在使用一种方法在字段中设置值，但验证仍然是无效的。

home.ts

@IonicPage()
@Component({
selector: 'page-home',
templateUrl: 'home.html',
})
export class HomePage {
addressForm: FormGroup;
constructor(public navCtrl: NavController,
            public navParams: NavParams,
            public formBuilder: FormBuilder) {
    this.addressForm = this.formBuilder.group({
        address:    [ '', [ Validators.required ]]
    });

}  

getGeolocation(form) {
    console.log(form.value);
    this.addressForm.setValue({'address':'Some word'})
}

saveGeoLocation(form) {
    console.log(form.value)
}
}

home.html的

<form novalidate [formGroup]="addressForm" >
    <ion-list no-border padding no-margin>
        <ion-item no-padding>
            <ion-label stacked>{{ 'ADDRESS' | translate }}</ion-label>
            <ion-input formControlName="address" name="address" placeholder="{{ 'ADDRESS_EXAMPLE' | translate }}" text-wrap></ion-input>
        </ion-item>
        <br />
        <button type="button" ion-button color="color-green" block clear (click)="getGeolocation(addressForm)" >
            <ion-icon name="navigate" icon-start></ion-icon>
             {{ 'MY_LOCATION' | translate }}
        </button>
    </ion-list>
</form>

截图 Link

感谢您的帮助:)）

@edit 我忘了展示我的工作场所 here my environment setup

IONIC 3验证表格出错

0 个答案: