Bootstrap DateTimpicker Angular 在 calenderdialog 中选择后绑定不更新

Question

我的 bootstrap 日期时间选择器的模型绑定有问题，在对话框中选择日期后它不会更新。当我直接编辑输入字段时，绑定被触发，但选择不会更新绑定。

<body ng-controller="MainCtrl">
  <p>Hello {{name}}! {{datum}}</p>
  <div class="input-group">
    <span class="input-group-addon add-on"><span class="fa fa-calendar"></span></span>
    <input type="text" class="form-control datetimepicker" ng-model="datum"/>                                                
  </div>
</body>


var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.datum = new Date();

  if($(".datetimepicker").length > 0){
    $('.datetimepicker').datetimepicker({
      format: 'YYYY-MM-DD HH:mm'
    });            
  }

});

Answer 1

普通 bootstrap 不适用于 angular。您将 need/should 使用 bootstrap-angular 绑定库 而不是 bootstrap 脚本。您仍然使用 bootstrap css/sass/less 等。Angularstrap 就是这样一个库，它不依赖于 jquery.

当您使用 angularstraps 日期选择器时，它会更新您的绑定。

（肮脏，丑陋，凌乱）的替代方法是将事件处理程序绑定到 bootstrap 日期选择器更改事件，并从那里调用 $scope.digest() and/or 触发 changed 在文本字段元素上手动事件。

Bootstrap DateTimpicker Angular 在 calenderdialog 中选择后绑定不更新

Bootstrap DateTimpicker Angular Binding doesn't update after selection in calenderdialog

model-binding

datetimepicker

angularjs

bootstrap-datetimepicker