Angular4 - 打字稿 - 生日验证（日，月，年）(Angular4 - Typescrip

试图实现的角度用户注册生日：定制生日选择器

所以，我用三个字段（日，月，年）。我想插入只有当日期域还涉及到一个月（例如：28 /月，而不是31 /月）的有效值。我如何能做到这一点的角度打字稿？

此外，这将是最好的生日存储在数据库中，三列或一列串联？

PS：我不使用本地日期选择器，因为生日它不会是非常好的，有点难以利用。

很感谢。

码：

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <form [formGroup]="formulario" (ngSubmit)="cadastraPessoa()" ngNativeValidate> <div class="form-group"> <input type="text" class="form-control" placeholder="Nome completo" formControlName="nomecompleto" required> </div> <div class="form-group"> <input type="email" class="form-control" placeholder="E-mail" formControlName="email" required> </div> <div class="form-group"> <input type="text" class="form-control" placeholder="Nome de usuário" formControlName="nomeusuario" required> </div> <div> <label>Data de Nascimento</label> <div class="container-fluid"> <div class="form-group col-xs-4 col-md-4" style="margin-right: 0px; padding-right:1px;"> <input style="margin-right: 0px;" type="text" minlength="2" maxlength="2" class="form-control" placeholder="Dia" formControlName="dianasc" required> </div> <div class="form-group col-xs-4 col-md-4" style="margin: 0px;"> <select name="mesnasc" formControlName="mesnasc" style="margin-right: 0px;" class="form-control" placeholder="Mês" required> <option selected="selected" disabled="disabled">Mês</option> <option value="1">Janeiro</option> <option value="2">Fevereiro</option> <option value="3">Março</option> <option value="4">Abril</option> <option value="5">Maio</option> <option value="6">Junho</option> <option value="7">Julho</option> <option value="8">Agosto</option> <option value="9">Setembro</option> <option value="10">Outubro</option> <option value="11">Novembro</option> <option value="12">Dezembro</option> </select> </div> <div class="form-group col-xs-4 col-md-4" style="margin: 0px; padding-left:1px;"> <input style="margin-right: 0px;" type="text" aria-invalid minlength="4" maxlength="4" class="form-control" placeholder="Ano" formControlName="anonasc" required> </div> </div> </div> <div class="form-group"> <input type="password" id="senha" class="form-control" name="senha" placeholder="Senha" formControlName="senha" [formGroup]="formulario"> </div> <div class="form-group"> <input type="password" class="form-control" id="confsenha" name="confsenha" placeholder="Confirmação de Senha" formControlName="confsenha" [formGroup]="formulario"> <small *ngIf="!formulario.controls.confsenha.valid || !formulario.controls.confsenha.dirty || (formulario.controls.confsenha.pristine && !formulario.submitted)" class="text-danger"> Password mismatch </small> </div> <button type="submit" id="submit" [ngClass]="{disabled : !isValid}" [disabled]="!isValid" class="btn btn-primary btn-sm btn-block">Cadastrar</button> <app-alert></app-alert> </form>

Answer 1:

有一个叫库momentjs可以用来做你正在寻找做日期验证。看看他们的文档，以打字稿，它很容易。

npm install moment

在将输出文件

import * as moment from 'moment';

现在，

var date = moment("2016-10-19");

date.isValid（）告诉你的日期是否有效。

Answer 2:

这里的验证代码。谢谢！

static ValidDate(AC: AbstractControl) {

const birthday = AC.get('birthday').value; // to get value in input tag
const birthMonth = AC.get('birthMonth').value; // to get value in input tag
const birthYear = AC.get('birthYear').value; // to get value in input tag
const fullDate = birthYear + '-' + birthMonth + '-' + birthday;

const fullDate = moment(concatDate,       'YYYY-MM-DD', true);
 moment.locale('pt-BR');

if ( birthday !== '' && birthMonth !== '' && birthYear !== '' ) {

  if (fullDate.isValid() ) {
    AC.get('birthday').setErrors( null);
    return null;
  } else {
    AC.get('birthday').setErrors( {invalidDate: true} );
  }
}
}