angular-moment-picker - Supporting locale based labels with english submission format

1
votes

I'm using the angular-moment-picker component for handling dates in my application and I'm working on introducing i18n support. I have the datepicker rendering correctly with arabic labels, however the submitted date string is also in arabic text. Is it possible to have the labels remain in the locale specified, but have the underlying model value remain in English format (to submit in, for example, YYYY-MM-DD format)?

The component has a change event, which I can use to listen to the date changing and reformat the date using the following code, however obviously the underlying model still contains Arabic text.

vm.onChange = function(newValue) {
  var englishDate = moment(newValue, 'LL', 'ar').locale('en');
  var date = englishDate.format('YYYY-MM-DD HH:mm');

  // date correctly contains the english format date however it is not on the model variable
}

Thank you!

1
angularjsdateinternationalizationmomentjs

1 Answers

0
votes

You can use different objects for the moment-picker and ng-model, where the one for moment-picker will be formatted and the ng-model will be a moment.js object.

<div id="fromDatePicker" class="input-group" moment-picker="vm.fromDateFormatted" format="L" ng-model="vm.fromDate">
<input class="form-control" ng-model="vm.fromDateFormatted" ng-model-options="{ updateOn: 'blur' }" placeholder="From date...">
<span class=" input-group-addon "><i class="icon icon-calendar "></i></span>
</div>

Use vm.fromDateFormatted for display and vm.fromDate in code like the change event

Formatted date: {{ vm.fromDateFormatted}}

Please see the answer in this issue for more information: https://github.com/indrimuska/angular-moment-picker/issues/92