jquery - Bootstrap DateTimePicker - Angular 的更改事件

标签 jquery angularjs twitter-bootstrap datetimepicker

鉴于以下演示:

http://jsfiddle.net/ADukg/8851/

我希望每次日期更改时我的 Controller 值都会更新。因此,每次从下面的框中选择新日期时,ng-model 的值都会更改。

enter image description here

但是,在使用以下指令时,我收到上面写的错误。

app.directive('datetimepicker', function () {
    return {
        restrict: 'A',
        require : 'ngModel',
        link : function (scope, element, attrs, ngModelCtrl) {

            element.datetimepicker({

                onRender:function (date) {

                    // Triggers a digest to update your model
                    scope.$apply(function () {
                        ngModelCtrl.$setViewValue(date);
                    });

                }

            });
        }
    } 
});

如何检测日期时间选择器的 Angular 变化?

最佳答案

Bootstrap 的 datetimepicker 插件不支持构造函数选项中的 change 事件,但您可以使用 dp.change 事件您刚刚添加了 datetimepicker 的元素:

  element.datetimepicker({});
  element.on('dp.change', function(event) { 
    scope.$apply(function () {
      ngModelCtrl.$setViewValue(event.date.format());
    });
  })

这是您的 jsfiddle 的更新:
http://jsfiddle.net/dekelb/fc9kuy3x/3/

关于jquery - Bootstrap DateTimePicker - Angular 的更改事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41403841/

相关文章:

javascript - 如何使我的 Bootstrap 按钮看起来像我想要的那样但仍能正常工作?

javascript - AngularJS 和 Require : r. js 给出未定义

html - 如何让 col-md-* 在手机屏幕上按照我想要的方式工作?

javascript - 如何跨窗口传递事件,可能吗?

javascript - Stripe 似乎创建了弹出窗口,但在移动设备上将其关闭

javascript - 正确保存数据到mongoDB

javascript - 单击图像右上角的 "X"标记删除图像

jquery - 在 onclick 事件中触发 Bootstrap 弹出窗口

javascript - 在 jquery 中为 json 数组生成 html 的标准方法

c# - 使用 jQuery 文件上传时,Request.Files 为空 File Upload with Internet Explore 6/9