Question

我有一个datetimepicker，我需要这个来将文本中的日期传递给模型。

我会把它放在一个小提琴中，但我不知道它是如何在这里有http://eonasdan.github.io/bootstrap-datetimepicker角度（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>

datetimepicker需要传入模型，完全卡住，直到它这样做我可以将它提交给数据库

任何想法？＆gt;

Answer 1

您需要触发#datetimepicker3的“输入”事件，因为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方法绑定事件（除非你还包含一个完整的jQuery，在这种情况下它的绑定方法将接管）。

Answer 2

<div class='input-group date'>
   <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>

此代码足以将值传递给范围

上的模型

ng-model="package.timeA"

不需要更多代码来了解datepicker如何使用bootstrap see this article

AngularJS：将结果从datepicker传递给ng-model

2 个答案: