在我的AngularJS应用程序中,我试图根据用户选择的时间段绘制图形(使用日期时间选择器)。屏幕截图如下:



使用1.7.1时

我正在使用bootstrap JS for date-time picker。问题是,当我使用JQuery版本1.7.1时,图形缩放有效,但日期时间选择器不起作用。
这是浏览器控制台中的错误:

Error: Failed to execute 'appendChild' on 'Node': The new child element is null.
    at Error (native)
    at Function.f.extend.clean (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:4522)
    at Function.f.buildFragment (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:2303)
    at f.fn.extend.domManip (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:1672)
    at f.fn.extend.append (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:3:31818)
    at DateTimePicker.fillDate (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:9195)
    at DateTimePicker.update (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:6538)
    at DateTimePicker.init (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:2408)
    at new DateTimePicker (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:125)
    at HTMLDivElement.<anonymous> (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:23028) <div class="input-append ng-pristine ng-valid" startdatetime="" ng-model="var1" ng-style="{'display': 'inline-block'}"> angular1.2.1.js:84
Error: Failed to execute 'appendChild' on 'Node': The new child element is null.
    at Error (native)
    at Function.f.extend.clean (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:4522)
    at Function.f.buildFragment (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:2303)
    at f.fn.extend.domManip (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:1672)
    at f.fn.extend.append (https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:3:31818)
    at DateTimePicker.fillDate (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:9195)
    at DateTimePicker.update (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:6538)
    at DateTimePicker.init (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:2408)
    at new DateTimePicker (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:125)
    at HTMLDivElement.<anonymous> (http://192.168.0.103:8080/restapi/date-picker/dateTimeBootstrap.js:26:23028) <div class="input-append ng-pristine ng-valid" enddatetime="" ng-model="var1" ng-style="{'display': 'inline-block'}">


使用1.9.1时

并且,当使用1.9.1时,图形缩放不起作用,但是日期时间选择器起作用。浏览器会抛出此错误:

Uncaught TypeError: Cannot read property 'addClass' of undefined jquery-ui.min.js:380
    a.widget._mouseCapturejquery-ui.min.js:380
    a.widget._mouseDownjquery-ui.min.js:26
    (anonymous function)jquery-ui.min.js:25
    b.event.dispatchjquery.js:9593
    v.handle


朋克码

这是plunkr code
JQuery脚本版本代码是指:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

最佳答案

将AngularJS与jQuery 1.9.1和jQuery UI 1.8.15或更低版本一起使用时,存在不兼容问题。
只需升级到较新版本的jQuery UI(在本例中为1.9.2+)即可解决该问题。

10-05 20:53
查看更多