web-dev-qa-db-fra.com

Comment changer le format de date dans le sélecteur de date de Angular ngx-bootstrap dans un formulaire

Utilisation de ngx-bootstrap Datepicker dans une application Angular 4,

Je sais que normalement vous pouvez spécifier le format de date de cette façon:

<input id="from" name="from"
       bsDatepicker [(bsValue)]="myModel"
       value="{{ myModel | date:'yyyy-MM-dd'}}">

mais cette fois, je suis dans un formulaire Angular formulaire, donc mon entrée n'est pas liée à une variable comme myModel dans l'exemple ci-dessus, mais elle est juste liée à la forme:

<input id="from" name="from"
       bsDatepicker ngModel>

alors comment puis-je spécifier le format de date dans ce cas?

Edit: il semble que le moyen d'y parvenir est de créer une nouvelle variable newVar à l'intérieur du composant, puis de la lier avec [(bsValue)]="newVar":

<input id="from" name="from"
       bsDatepicker ngModel
       [(bsValue)]="newVar"
       value="{{ newVar | date:'yyyy-MM-dd' }}">

Cependant, je me demande s'il existe une meilleure solution.

angulardatepickerangular2-ngmodelangular-formsngx-bootstrap
9
Francesco Borzi

[(bsValue)] est toujours disponible pour une utilisation avec bsDatepicker, sera-t-il un champ de saisie ou non

si vous souhaitez modifier le format d'un seul champ,

[(bsValue)]="newVar" value="{{ newVar | date:'yyyy-MM-dd' }}" est très bien

bsDatepicker a une intégration avec les champs de saisie et les formulaires, cela devrait fonctionner pour vous:

<input name="from" bsDatepicker [(ngModel)]="newVar">

et vous pouvez changer globalement le format de la date dans la valeur de l'entrée via config

https://github.com/valor-software/ngx-bootstrap/blob/development/src/datepicker/bs-datepicker.config.ts#L31

ou via [bsConfig]="{dateInputFormat: 'yyyy-MM-dd'}" sur l'élément avec bsDatepicker

note : il y a actuellement un problème (v1.9.2) avec le format L, il utilise toujours les paramètres régionaux en-us

18
valorkin

Si vous utilisez le sélecteur de plage de dates, vous devez utiliser rangeInputFormat dans [bsConfig] au lieu de dateInputFormat.

2
MANMOHAN

Serez-vous en mesure d'expliquer comment utiliser ce fichier de configuration pour utiliser un format de date global?

J'ai parcouru le lien github que vous avez fourni ci-dessus mais je n'ai pas réussi à comprendre comment l'utiliser dans mon projet car il contient beaucoup de fichiers d'importation. J'utilise actuellement le code en ligne ci-dessous pour changer le format de la date.

bsDatepicker [(bsValue)]="newVar" value="{{ newVar | date:'yyyy-MM-dd' }}"

Existe-t-il une méthode pour mettre ce format de date 'aaaa-MM-jj' dans un fichier de configuration globalement afin que je puisse simplement imprimer une date dans n'importe quel champ de bsDatepicker sans avoir besoin de mentionner explicitement le format?

2
Pubudu Senarathne