1

我正在使用 Eonasdan 日期时间选择器。这是我的代码

<div class="form-group">
    <div class='input-group date' id='datetimepicker'>
        <input type='text' ng-model="dtime" name="time" class="form-control"/>
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-time"></span>
        </span>
    </div>
</div>

而这个用于时间选择器的 js

<script type="text/javascript">
    (function () {
        $('#datetimepicker').datetimepicker({
            format: 'LT',
            enabledHours: [9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]
        });
    })();
</script>

但在我的控制器中，我无法使用 $scope.dtime。它给出了 undefined 作为它的值。

4

2 回答 2

2

有一个功能丰富的库，无缝集成了 Bootstrap 和 AngularJS

https://angular-ui.github.io/bootstrap/#/datepicker

您不需要从头开始编写指令。始终使用 Angular 优先方法。

我希望这能帮到您。

于 2016-03-16T18:21:18.817 回答
1

如果您想使用引导程序中的时间选择器，您可能需要将其包装为指令。默认情况下，您不会获得所选日期，$scope因为 的值input是由javascript代码从外部更新的。作为概念证明，您可以参考以下链接。

http://plnkr.co/edit/BEkkfwbhP7bYMtleQOzC?p=preview

在此示例$scope.hello中设置为Hello因此在 UI 中打印“Hello World”。的值在 UI 中与hello绑定，input单击按钮时您可以更改该值，但同样不会反映在范围中，您仍然会看到打印的“Hello World”。

或者，如果您在input框中键入内容，那么相同的内容将反映在 UI 中。

我建议参考这个较早的线程，其中讨论了几乎相同的问题

如何将 datetimepicker js 包装到 AngularJS 指令中

于 2016-03-16T17:31:36.540 回答