使用引导时间选取器时,没有更新数据ng模型值

data-ng-model values are not being updated while Using Bootstrap Time Picker

本文关键字:更新 数据 ng 模型 时间 选取      更新时间:2023-09-26

我从时间选择器中选择的值没有更新,但当我删除时间选择器并使用正常的文本框更新时,时间选择器或我的代码出了什么问题?

<div  data-ng-repeat="mondayBhr in businessHour.mon" class="form-group">
            <label class="col-sm-1 label-group" for="mondayStoreOpentimingsedit">Open</label>
            <div class="form-group">
                <div class="bootstrap-timepicker">
                    <input  id="mondayStoreOpentimingsedit" name="mondayStoreOpentimingsedit" ng-model="mondayBhr.store[0].open"  style="max-height:25px" class="col-md-2"  />
                    <script>
                        $('#mondayStoreOpentimingsedit').timepicker({
                            showMinutes:true,
                            showMeridian:false,
                            pick12HourFormat: true
                        }).next().on(ace.click_event, function(){
                            $(this).prev().focus();
                        });
                        </script>
                </div>
            </div>
        </div>

非常感谢您的提前帮助!!

使用jquery插件交互AngularJS 时始终使用指令

标记

<input  id="mondayStoreOpentimingsedit" time-picker name="mondayStoreOpentimingsedit" 
ng-model="mondayBhr.store[0].open" style="max-height:25px" class="col-md-2"  />

指令

app.directive('timePicker', function() {
    return {
        restrict: 'A',
        reuqire: 'ngModel',
        link: function(scope, element, attrs, ngModel) {
            element.timepicker({
                showMinutes: true,
                showMeridian: false,
                pick12HourFormat: true,
                change: function(time) {
                    //need to run digest cycle for applying bindings
                    scope.$apply(function() {
                        ngModel.$setViewValue(time);
                    });
                }
            }).next().on(ace.click_event, function() {
                $(this).prev().focus();
            });
        }
    }
});