meteor-bootstrap-datetimepicker 在登陆已经有一个 init 的路由/模板时出错

Question

这是我正在使用的软件包：https://github.com/tsega/meteor-bootstrap3-datetimepicker

我有一个"仪表板"模板，它在加载时会在其上获取 dtp 初始化。 我在Template.dashboard.rendered函数中执行此操作。

我尝试使用 dtp 的 destroy() 函数，但在Template.dashboard.destroyed函数中使用它时... of undefined错误。

错误和我的代码如下。

错误。。。。。。。

Exception in defer callback: TypeError: Cannot read property 'dateFormat' of undefined
    at dataToOptions (http://localhost:3000/packages/tsega_bootstrap3-datetimepicker.js?3ee822b778b56b656aef2c57849bd1c71e98b58e:257:22)
    at init (http://localhost:3000/packages/tsega_bootstrap3-datetimepicker.js?3ee822b778b56b656aef2c57849bd1c71e98b58e:110:13)
    at new DateTimePicker (http://localhost:3000/packages/tsega_bootstrap3-datetimepicker.js?3ee822b778b56b656aef2c57849bd1c71e98b58e:1383:9)
    at HTMLDivElement.<anonymous> (http://localhost:3000/packages/tsega_bootstrap3-datetimepicker.js?3ee822b778b56b656aef2c57849bd1c71e98b58e:1391:46)
    at Function.jQuery.extend.each (http://localhost:3000/packages/jquery.js?265926494aaa3929cd2e30da265211c5929f37a4:417:23)
    at jQuery.fn.jQuery.each (http://localhost:3000/packages/jquery.js?265926494aaa3929cd2e30da265211c5929f37a4:170:17)
    at $.fn.datetimepicker (http://localhost:3000/packages/tsega_bootstrap3-datetimepicker.js?3ee822b778b56b656aef2c57849bd1c71e98b58e:1387:21)
    at http://localhost:3000/client/templates/views/dashboard/appointments_panel.js?e214cbf044fe31c31fe6ab3e7801ca895fa5b10d:45:26
    at _.extend.withValue (http://localhost:3000/packages/meteor.js?61916b1060b33931a21f104fbffb67c2f3d493c5:945:17)
    at http://localhost:3000/packages/meteor.js?61916b1060b33931a21f104fbffb67c2f3d493c5:430:45 debug.js:41

我的模板js代码...

Template.appointments_panel.rendered = function(){
    Meteor.defer(function(){
        $(".datepicker").datetimepicker({
            minuteStepping: 15,
            sideBySide: true
        })
            .on('dp.change', function(e){
                _.extend(picker, {_startat: e.date._d})
                $('.btn-calendar').tooltip('destroy')
            })
            .on('dp.hide', function(e){
                $('.btn-calendar').tooltip({
                    placement : 'top',
                    title : moment(picker._startat).format('ll @ h:mm a')
                })
            })
    })
}

我的模板 html ....

    <form role="form">
        <div class="list-group input-group">
            <span class="input-group-btn datepicker">
                <button type="button" class="btn btn-default btn-calendar"><i class="fa fa-calendar"></i></button>
                <input class="datepickerinput" type="hidden" />
            </span>
            <input class="form-control" type="text" id="notes" name="notes" placeholder="notes..." />
            <span class="input-group-btn"><button class="btn btn-default btn-save" type="submit"><i class="fa fa-save"></i></button></span>
        </div>
    </form>

Answer 1

destroy()函数是隐藏的，没有记录在这里的手册页上： http://eonasdan.github.io/bootstrap-datetimepicker/

在我阅读了大量源代码后，我意识到要访问destroy() func，它出现在.data('DateTimePicker')对象上。

我希望这有助于有人避免我花在这个问题上的最后两天。

Template.appointments_panel.rendered = function(){
    Meteor.defer(function(){
        $('.datepicker').datetimepicker({
            minuteStepping: 15,
            sideBySide: true
        })
            .on('dp.change', function(e){
                _.extend(picker, {_startat: e.date._d})
                $('.btn-calendar').tooltip('destroy')
            })
            .on('dp.hide', function(e){
                $('.btn-calendar').tooltip({
                    placement : 'top',
                    title : moment(picker._startat).format('ll @ h:mm a')
                })
            })
    })
}
Template.appointments_panel.destroyed = function() {
    picker = {}
    $('.datepicker').data('DateTimePicker').destroy()
}