javascript - AngularJS : Pass results from datepicker to ng-model

Question

我有一个日期时间选择器，我需要它来将文本内的日期传递给模型。

我会把它放在 fiddle 中，但我不知道如何，因为它有位于此处的引导时间选择器 http://eonasdan.github.io/bootstrap-datetimepicker Angular(obvs) 和其他东西

这就是我到目前为止所拥有的；

  <div class="form-group">
                  <div class='input-group date' ng-model="package.timeA">
                      <input type='text' id='datetimepicker3' ng-model="package.timeA" ng-change="alert('Hello')" class="form-control" />
                      <span class="input-group-addon" ng-model="package.timeA">
                          <span class="glyphicon glyphicon-time"></span>
                      </span>
                  </div>
              </div>

          <script type="text/javascript">
              $(function () {
                  $('#datetimepicker3').datetimepicker({
                      format: 'LT'
                  }).on("dp.change", function(e) {
                    document.getElementById('datetimepicker3').value = e.date;
                  });
              });
          </script>

日期时间选择器需要传递到模型中，完全卡住，直到它这样做，以便我可以将其提交到数据库

有什么想法吗？>

Answer 1

您将需要触发 #datetimepicker3 的“input”事件，因为 ng-model 会监听此事件，因此它将更新其值:

<script type="text/javascript">
              $(function () {
                  $('#datetimepicker3').datetimepicker({
                      format: 'LT'
                  }).on("dp.change", function(e) {
                    document.getElementById('datetimepicker3').value = e.date;
                    $('#datetimepicker3').trigger('input'); // trigger input event
                  });
              });
          </script>

根据How does AngularJS internally catch events like 'onclick', 'onchange'?

Angular 默认情况下监听 input 事件，如果浏览器不支持它，它将回退到 keydown + change 事件。

事件与 jQlite 的绑定(bind)方法绑定(bind)(除非您还包含完整的 jQuery，在这种情况下，其绑定(bind)方法将接管)。