Inscrivez-vous

Question

我绝对需要您的帮助：p

我对Ionic很陌生，但是如果我做得不好，我真的很想学习借口！

这是我的代码HTML：

有关更多信息，请参见http://ionicframework.com/docs/components/#navigation 离子页面和导航。 ->

Inscrivez-vous

<form [formGroup]="formgroup">
<ion-list class="item">

    <ion-row radio-group>

        <ion-col>
          <ion-item>
            <ion-label>Homme</ion-label>
            <ion-radio value="homme"></ion-radio>
          </ion-item>
        </ion-col>
        <ion-col>
          <ion-item>
           <ion-label>Femme</ion-label>
            <ion-radio value="femme"></ion-radio>
          </ion-item>
        </ion-col>
      </ion-row>

  <ion-item>
    <ion-label stacked>Prénom</ion-label>
    <ion-input class="colorInput" type="text" formControlName="prenom" ></ion-input>
  </ion-item>



  <ion-item>
      <ion-label>Date de Naissance</ion-label>
      <ion-datetime class="colorInput" displayFormat="DD/MM/YYYY" ></ion-datetime>
    </ion-item>


  <ion-item>
    <ion-label stacked>Mail</ion-label>
    <ion-input class="colorInput" type="text" formControlName="mail"></ion-input>
  </ion-item>

  <ion-item>
    <ion-label stacked>Mot de passe</ion-label>
    <ion-input class="colorInput" placeholder="Min. 6 caractères" type="password" formControlName="motDePasse"></ion-input>
  </ion-item>

</ion-list>

<button ion-button round class="button" (click)="ToastError();">Connexion</button>

`

还有我的TS文件：

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { FormBuilder, FormGroup, Validators, AbstractControl } from '@angular/forms';
import { ToastController } from 'ionic-angular';


@IonicPage()
@Component({
  selector: 'page-sign-in',
  templateUrl: 'sign-in.html',
})
export class SignInPage {

  formgroup: FormGroup;

  prenom: AbstractControl;
  mail: AbstractControl;
  motDePasse: AbstractControl;

  constructor(public navCtrl: NavController, public navParams: NavParams, public formbuilder: FormBuilder, public toastCtrl: ToastController) {

    this.formgroup = formbuilder.group({

      prenom: ['',Validators.required],

      mail: ['',Validators.required],
      motDePasse: ['',Validators.required]
    });


    this.prenom = this.formgroup.controls['prenom'];

    this.mail = this.formgroup.controls['mail'];
    this.motDePasse = this.formgroup.controls['motDePasse'];
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad SignInPage');
  }

  ToastError(prenom) {
    const Toast = this.toastCtrl.create({
      message: 'pas ok',
      duration: 2000
    });

    if (prenom == '1' ) {
      Toast.present();
    }

  }
}

目标是第一次检查用户是否输入了他的名字，如果不是这样的话，我希望举杯。

如果您有一些想法：）

白天/晚上过得愉快！

Answer 1

只需将此按钮添加到.html

<button ion-button round class="button" (click)="ToastError(formgroup.value.prenom)">Connexion</button>

这是.ts函数

ToastError(prenom) {

        const Toast = this.toastCtrl.create({
            message: 'pas ok',
            duration: 2000
        });

        prenom ? console.log('prenom found') : Toast.present();

    }

随时发表评论以寻求更多帮助

离子形式验证器与吐司

Inscrivez-vous

1 个答案: