從datetimepicker角度獲取日期

Question

我正在嘗試從引導datetimepicker獲取日期，但是當我在輸入字段上放置ng-model時，它不起作用嗎？

HTML

<!-- EndDate -->
<div class="form-group">
    <label for="dtp_enddate">Eind datum:</label>
    <div class="input-group date" id="dtp_endDate">
        <input type="text" class="form-control" name="EndDate" ng-model="employeeCtrl.employee.EndDate" required="required" />
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
    </div>
</div>

jQuery的

   $(function() {
        $('#dtp_endDate').datetimepicker({
            useCurrent: true,
            collapse: true,
            format: 'YYYY-MM-D',
            locale: 'nl',
            allowInputToggle: true
        });
    });

我該怎么做？

Answer 1

將angularJS與jQuery插件結合並不是最佳實踐。 有很多轉換為angularJS指令的插件，您可以嘗試使用。 例如https://github.com/dalelotts/angular-bootstrap-datetimepicker

Answer 2

如果您需要單個組件中的日期時間選擇器，則可以使用http://dalelotts.github.io/angular-bootstrap-datetimepicker/ ，也可以使用Angular Bootstrap中的 2個組件（日期選擇器和時間選擇器）

Answer 3

例如

<input type="text" datepicker-popup="dd-MMMM-yyyy" ng-model="dt" />
in this example date is binding to dt (ng-model="dt")

如果您想觀看日期更改，可以通過$ scope.dt獲取數據

$scope.$watch('dt',function(val){
   //to do       
   console.log(val)
})

Answer 4

在輸入標記中包含id =“ dtp_endDate”

<input type="text" id="dtp_endDate" class="form-control" name="EndDate" ng-model="employeeCtrl.employee.EndDate" required="required" />