ng-bootstrap datepicker format

Je suis en utilisant ng-bootstrap datepicker mais lorsque je sauvegarde mon formulaire la date est enregistrée comme.

date: {
  day: 01,
  month: 12,
  year: 16
}

J'espérais que je pourrais l'obtenir pour enregistrer en tant que quelque chose de plus comme "2016-11-23T00:39:31.768Z"

Voici mon oeuvre:

<div class="input-group">
  <button class="input-group-btn" (click)="d.toggle()" >
    <md-icon svgSrc="assets/images/calendar-plus.svg" style="cursor: pointer;"></md-icon>
  </button>
  <input class="form-control" placeholder="dd-mm-yyyy" name="dp" formControlName="due_date" navigation="arrows" ngbDatepicker #d="ngbDatepicker">
</div>

Et la forme.composant:

constructor( private fb: FormBuilder ) {
    this.form = this.fb.group({
      due_date: [''],
    });
  }

OriginalL'auteur Daimz | 2016-11-24

  1. 14

    Vous utilisez ng-bootstrap pas ng2-bootstrap (les différents groupes). Le code derrière elle utilise le NgbDateStruct qui est un objet { day, month, year }

    Sur la soumission, vous aurez besoin de crochet et de modification de la valeur à quelque chose d'autre, comme:

    onSubmit(): {
    let ngbDate = this.form.controls['due_date'].value;
    let myDate = new Date(ngbDate.year, ngbDate.month-1, ngbDate.day);
    let formValues = this.form.value;
    formValues['due_date'] = myDate;
    <...>
    http.post(url, formValues);
}

    https://ng-bootstrap.github.io/#/components/datepicker

    NgbDateStruct Interface du modèle de la NgbDatepicker et
    NgbInputDatepicker directives

    Propriétés

    jour Type: numéro Du jour du mois, commençant à partir de 1

    mois Type: numéro Du mois, avec le calendrier par défaut, nous utilisons la norme ISO 8601: 1=Jan
    ... 12=Décembre

    année Type: numéro de L'année, par exemple 2016

    Il me énigmes pourquoi ils ont décidé d'inventer leur propre petit objet date, au lieu de simplement à l'aide d'un objet Date. Je ne peux penser à aucune raison valable de le faire, et je déteste avoir à écrire du code supplémentaire pour la conversion depuis le format.

    OriginalL'auteur silentsod

  2. 12

    @Silentsod mentionné, vous avez besoin de convertir l'objet date que le datepicker utilise de la NgbDateStruct format dans un string format. ng-bootstrap fournit une fonction pour convertir une date dans le NgbDateStruct format à l' ISO 8601 format (aaaa-mm-jj). Vous n'avez pas à écrire votre propre si vous utilisez ce format:

    import {NgbDateParserFormatter} from '@ng-bootstrap/ng-bootstrap';

...

constructor(private ngbDateParserFormatter: NgbDateParserFormatter; ... ) {
    ...
}

...

onSubmit(): {
    let ngbDate = this.form.controls['due_date'].value;
    let myDate = this.ngbDateParserFormatter.format(ngbDate); //e.g. myDate = 2017-01-01
    ...
}

    Voir: https://github.com/ng-bootstrap/ng-bootstrap/blob/master/src/datepicker/ngb-date-parser-formatter.ts

    OriginalL'auteur TiaanM

  3. 0

    Vous pouvez implémenter votre propre méthode pour convertir JJ-MM-AAAA format que vous désirez.

    Ou en fonction de l'ordre des éléments dans les instruction de retour et d'un séparateur, vous pouvez créer n'importe quel autre format que vous souhaitez.

    Mise en œuvre:

    formatDate(d: NgbDate): string {
  if (d === null) {
    return null;
  }

  return [
    (d.day < 10 ? ('0' + d.day) : d.day),
    (d.month < 10 ? ('0' + d.month) : d.month),
    d.year
  ].join('-');
}

    OriginalL'auteur jabko87