El uso de ngx-bootstrap Datepicker en un Angular 4 aplicación,

Sé que normalmente puede especificar el formato de fecha en esta manera:

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

pero esta vez estoy dentro de una plantilla-conducido de forma Angular, así que mi entrada no está vinculado a una variable como myModel en el ejemplo anterior, pero es sólo vinculado a la forma:

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

entonces, ¿cómo puedo especificar el formato de fecha en este caso?

Editar: parece que una manera de lograr esto es mediante la creación de una nueva variable newVar dentro del componente y, a continuación, enlace con [(bsValue)]="newVar":

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

Sin embargo, me pregunto si hay una solución mejor.

3 Comentarios

  1. 17

    [(bsValue)] está siempre disponible para su uso con bsDatepicker,
    será campo de entrada o no

    si desea cambiar el formato de un solo campo, a continuación,

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

    bsDatepicker tiene integración con campos de entrada de datos y formularios, esto debería funcionar para usted:

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

    y que a nivel mundial puede cambiar el formato de fecha en entradas de valor a través de config

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

    o a través de [bsConfig]="{dateInputFormat: 'yyyy-MM-dd'}" sobre el elemento con el bsDatepicker

    nota: en la actualidad existe un problema (v1.9.2) con L formato, siempre se utiliza la configuración regional en-us

  2. 2

    Va a ser capaz de elaborar sobre cómo utilizar este archivo de configuración para utilizar un global de formato de fecha?

    Me fui a través de github enlace proporcionado arriba, pero fue incapaz de averiguar cómo utilizar que en mi proyecto, porque tiene gran cantidad de archivos de importación. Actualmente estoy usando el siguiente código en línea para cambiar el formato de fecha.

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

    Hay un método para poner esta fecha en formato ‘yyyy-MM-dd’ en un archivo de configuración a nivel mundial por lo que sólo puedo imprimir una fecha en cualquier campo de bsDatepicker sin tener necesidad de una mención explícita el formato?

  3. 2

    Si usted está usando Date range Picker Entonces usted debe utilizar rangeInputFormat en [bsConfig] en lugar de dateInputFormat.

    • Me había Fijado por esta opción
    • Puedo confirmar que esto funciona perfectamente con un Rango de Fecha Selector, me tomó un tiempo para encontrar esta solución.

Dejar respuesta

Please enter your comment!
Please enter your name here