title: Angular4 - Typescript - Birthday Validation (Day, Month, Year)
body: <p>Trying to implement Birthday in angular user register:
  <a href="https://i.stack.imgur.com/A2Dpp.png" rel="nofollow noreferrer">Custom Birthday picker</a></p>
  
  <p>So, I use three fields(day, month, year). I want to insert only if the day field has a valid value related to the month (ex.: 28/february and not 31/february).
  How can I do that in angular typescript?</p>
  
  <p>Also, what would be best to store the birthday in database, the three columns or concatenate in one column?</p>
  
  <p>Ps.: I'm not using a native datepicker because for birthday it would not be very nice and a little hard to use.</p>
  
  <p>Very thanks.</p>
  
  <p>Code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"&gt;&lt;/script&gt;
  &lt;form [formGroup]="formulario" (ngSubmit)="cadastraPessoa()" ngNativeValidate&gt;
    &lt;div class="form-group"&gt;
      &lt;input type="text" class="form-control" placeholder="Nome completo" formControlName="nomecompleto" required&gt;
    &lt;/div&gt;
    &lt;div class="form-group"&gt;
      &lt;input type="email" class="form-control" placeholder="E-mail" formControlName="email" required&gt;
    &lt;/div&gt;
  
    &lt;div class="form-group"&gt;
      &lt;input type="text" class="form-control" placeholder="Nome de usuário" formControlName="nomeusuario" required&gt;
    &lt;/div&gt;
  
  
    &lt;div&gt;
      &lt;label&gt;Data de Nascimento&lt;/label&gt;
      &lt;div class="container-fluid"&gt;
        &lt;div class="form-group col-xs-4 col-md-4" style="margin-right: 0px; padding-right:1px;"&gt;
          &lt;input style="margin-right: 0px;" type="text" minlength="2" maxlength="2" class="form-control" placeholder="Dia" formControlName="dianasc" required&gt;
        &lt;/div&gt;
        &lt;div class="form-group col-xs-4 col-md-4" style="margin: 0px;"&gt;
          &lt;select name="mesnasc" formControlName="mesnasc" style="margin-right: 0px;" class="form-control" placeholder="Mês" required&gt;
                &lt;option selected="selected" disabled="disabled"&gt;Mês&lt;/option&gt;
                &lt;option value="1"&gt;Janeiro&lt;/option&gt;
                &lt;option value="2"&gt;Fevereiro&lt;/option&gt;
                &lt;option value="3"&gt;Março&lt;/option&gt;
                &lt;option value="4"&gt;Abril&lt;/option&gt;
                &lt;option value="5"&gt;Maio&lt;/option&gt;
                &lt;option value="6"&gt;Junho&lt;/option&gt;
                &lt;option value="7"&gt;Julho&lt;/option&gt;
                &lt;option value="8"&gt;Agosto&lt;/option&gt;
                &lt;option value="9"&gt;Setembro&lt;/option&gt;
                &lt;option value="10"&gt;Outubro&lt;/option&gt;
                &lt;option value="11"&gt;Novembro&lt;/option&gt;
                &lt;option value="12"&gt;Dezembro&lt;/option&gt;
              &lt;/select&gt;
        &lt;/div&gt;
        &lt;div class="form-group col-xs-4 col-md-4" style="margin: 0px; padding-left:1px;"&gt;
          &lt;input style="margin-right: 0px;" type="text" aria-invalid minlength="4" maxlength="4" class="form-control" placeholder="Ano" formControlName="anonasc" required&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;div class="form-group"&gt;
      &lt;input type="password" id="senha" class="form-control" name="senha" placeholder="Senha" formControlName="senha" [formGroup]="formulario"&gt;
  
  
    &lt;/div&gt;
    &lt;div class="form-group"&gt;
      &lt;input type="password" class="form-control" id="confsenha" name="confsenha" placeholder="Confirmação de Senha" formControlName="confsenha" [formGroup]="formulario"&gt;
      &lt;small *ngIf="!formulario.controls.confsenha.valid || !formulario.controls.confsenha.dirty || (formulario.controls.confsenha.pristine &amp;&amp; !formulario.submitted)" class="text-danger"&gt;
            Password mismatch
          &lt;/small&gt;
  
    &lt;/div&gt;
  
  
  
  
    &lt;button type="submit" id="submit" [ngClass]="{disabled : !isValid}" [disabled]="!isValid" class="btn btn-primary btn-sm btn-block"&gt;Cadastrar&lt;/button&gt;
    &lt;app-alert&gt;&lt;/app-alert&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>