ng-model不接受通过jquery时间选择器输入的值;

时间:2018-11-07 07:40:48

标签: javascript jquery angularjs angularjs-directive jquery-plugins

我创建了一个时间类型输入框,其值应该输入范围内的变量(使用ng-model),时间选择是通过一个带有小时的下拉列表,由jQuery时间选择器插件创建。但是当我选择一个小时后,可以在“输入”框中看到所选的值,但是输入具有“ ng-invalid”类,--->值未输入模型。

jquery时间选择器脚本和链接:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
 <script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>

jquery插件(放置在指令中):

app.directive("timepicker", ["$timeout", function ($timeout) {
    return {
        restrict: "C",
        transclude: true,
        link: function (scope, element, attr) {
            $timeout(function () {

                element.timepicker({
                    timeFormat: 'HH:mm',
                    interval: 15,
                    minTime: '24',
                    maxTime: '23:00',
                    startTime: '00:00',
                    dynamic: false,
                    dropdown: true,
                    scrollbar: true          
                });
                angular.element(".ui-timepicker-viewport").addClass('scrollbar');
                angular.element(".ui-timepicker-viewport").addClass('scrollbar-primary2');

            });
        }
    }
}]);

输入:

@Html.TextBox("rt-time", null, new
                       {
                           id = "rt-time",
                           @class = Model.Rtl ? "input-field time-input timepicker rtl-position" : "input-field time-input clockpicker ltr-position",
                           ng_model = "newOrder.routes[0].time",
                           required = "required",
                           aria_label = @UBUS.Resources.Languages.HomePage.HomePage.PlaceholderTime,
                           placeholder = @UBUS.Resources.Languages.HomePage.HomePage.PlaceholderTime,
                           autocomplete = "off"
                       })

jquery timepicker插件创建的下拉列表: enter image description here

在我选择时间之后,输入的类别为“ ng-invalid” enter image description here

0 个答案:

没有答案