2

如何允许用户以不同格式在输入表单中输入日期?我看到选项 alt-input-formats。我试图传递替代格式但没有结果。控制器:

vm.altInputFormats = ['M!/d!/yyyy'];

标记:

        <div class="calendar">
            <label>END DATE</label>
            <input type="text"
                   ng-click="vm.toggleCalendar('endDate')"
                   class="calendar-control"
                   uib-datepicker-popup="{{'MM/dd/yy'}}"
                   ng-model="vm.dateFilter.endDate"
                   is-open="vm.endDateOpened"
                   datepicker-options="vm.datePickerOptions"
                   min-date="vm.dateFilter.startDate"
                   max-date="vm.currentDate"
                   show-button-bar="false"
                   alt-input-formats="vm.altInputFormats"
                   close-text="Close" />
            <i ng-click="vm.toggleCalendar('endDate')" class="glyphicon glyphicon-calendar calendar-btn"></i>
        </div>

现在我只能以这种格式输入日期:01/01/16,但对于 01/01/2016,我在模型中未定义。我的代码有什么问题?

4

3 回答 3

3

alt-input-formats 被定义为指令 uibDatepickerPopup 中的一个属性,因此它不能将 vm.altInputFormats 作为一个数组。解决此问题的一种方法是将数组直接插入 alt-input-formats

<input type="text"
                   ng-click="vm.toggleCalendar('endDate')"
                   class="calendar-control"
                   uib-datepicker-popup="{{'MM/dd/yy'}}"
                   ng-model="vm.dateFilter.endDate"
                   is-open="vm.endDateOpened"
                   datepicker-options="vm.datePickerOptions"
                   min-date="vm.dateFilter.startDate"
                   max-date="vm.currentDate"
                   show-button-bar="false"
                   alt-input-formats="['M!/d!/yyyy', 'yyyy-M!-d!']"
                   close-text="Close" />
于 2017-03-14T00:01:16.143 回答
3

不应该作为属性提供,altInputFormats而是作为datepicker-options配置对象的一部分提供。在你的情况下:

<input type="text"
       ng-click="vm.toggleCalendar('endDate')"
       class="calendar-control"
       uib-datepicker-popup="{{'MM/dd/yy'}}"
       ng-model="vm.dateFilter.endDate"
       is-open="vm.endDateOpened"
       datepicker-options="vm.datePickerOptions"
       min-date="vm.dateFilter.startDate"
       max-date="vm.currentDate"
       show-button-bar="false"
       close-text="Close" />

然后在控制器中

vm.datePickerOptions = {
  altInputFormats: ['M!/d!/yyyy'],
  // rest of options ...
}
于 2016-03-23T12:59:25.310 回答
-1

尝试更改此行。

alt-input-formats="vm.altInputFormats[0]"
于 2016-03-23T11:44:17.997 回答