ReferenceError:未定义kendo

时间:2016-06-22 22:22:38

标签: angular kendo-grid

我尝试创建一个示例应用程序,用于加载包含在angular2组件中的kendo-grid。当我尝试运行应用程序时,我在Chrome浏览器中得到例外,如下所示

angular2.dev.js:24821 EXCEPTION: Error in :0:0BrowserDomAdapter.logError @ angular2.dev.js:24821
angular2.dev.js:24821 ORIGINAL EXCEPTION: ReferenceError: kendo is not definedBrowserDomAdapter.logError @ angular2.dev.js:24821
angular2.dev.js:24821 ORIGINAL STACKTRACE:BrowserDomAdapter.logError @ angular2.dev.js:24821
angular2.dev.js:24821 ReferenceError: kendo is not defined
    at Kendogrid.setUpGridOptions (Kendogrid.ts:23)
    at new Kendogrid (Kendogrid.ts:19)
    at AppView._View_Kendogrid_Host0.createInternal (Kendogrid_Host.template.js:15)
    at AppView.create (angular2.dev.js:22641)
    at ComponentFactory.create (angular2.dev.js:7668)
    at angular2.dev.js:8215
    at angular2.dev.js:8192
    at ZoneDelegate.invoke (angular2-polyfills.js:349)
    at Object.NgZoneImpl.inner.inner.fork.onInvoke (angular2.dev.js:2185)
    at ZoneDelegate.invoke (angular2-polyfills.js:348)

我没有收到任何其他异常细节,也无法继续解决此问题。

我尝试在Plunker

中复制相同的问题

如果我尝试使用HTTP上的引用,则会出现以下错误

Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure stylesheet 'http://cdn.kendostatic.com/2015.3.1111/styles/kendo.common.min.css'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:25 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure stylesheet 'http://cdn.kendostatic.com/2015.3.1111/styles/kendo.mobile.all.min.css'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:26 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure stylesheet 'http://cdn.kendostatic.com/2015.3.1111/styles/kendo.dataviz.min.css'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:27 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure stylesheet 'http://cdn.kendostatic.com/2015.3.1111/styles/kendo.default.min.css'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:28 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure stylesheet 'http://cdn.kendostatic.com/2015.3.1111/styles/kendo.dataviz.default.min.css'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:1 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure script 'http://cdn.kendostatic.com/2015.3.1111/js/jszip.min.js'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:1 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure script 'http://cdn.kendostatic.com/2015.3.1111/js/kendo.all.min.js'. This request has been blocked; the content must be served over HTTPS.
run.plnkr.co/:1 Mixed Content: The page at 'https://plnkr.co/edit/GpVY7KsFT0aExAz3G7ka?p=preview' was loaded over HTTPS, but requested an insecure script 'http://cdn.kendostatic.com/2015.3.1111/js/kendo.aspnetmvc.min.js'. This request has been blocked; the content must be served over HTTPS.
angular2-polyfills.js:349 Error: Error: Invalid provider - only instances of Provider and Type are allowed, got: [object Object](…)

上一条错误消息显示以下堆栈跟踪

angular2-polyfills.js:349 Error: Error: Invalid provider - only instances of Provider and Type are allowed, got: [object Object]
        at InvalidProviderError.BaseException [as constructor] (https://npmcdn.com/@angular/core/bundles/core.umd.js:4383:27)
        at new InvalidProviderError (https://npmcdn.com/@angular/core/bundles/core.umd.js:4645:20)
        at eval (https://npmcdn.com/@angular/core/bundles/core.umd.js:5590:23)
        at Array.forEach (native)
        at _normalizeProviders (https://npmcdn.com/@angular/core/bundles/core.umd.js:5573:19)
        at eval (https://npmcdn.com/@angular/core/bundles/core.umd.js:5584:17)
        at Array.forEach (native)
        at _normalizeProviders (https://npmcdn.com/@angular/core/bundles/core.umd.js:5573:19)
        at eval (https://npmcdn.com/@angular/core/bundles/core.umd.js:5584:17)
        at Array.forEach (native)
    Error loading https://run.plnkr.co/6WhTDJtCImd7LHoc/src/main.ts

任何人都可以对此有所了解,让我知道我所犯的问题/错误是什么?

1 个答案:

答案 0 :(得分:0)

我找到了答案。以下代码用于生成包含在angular2组件中的kendogrid。

  private setUpGridOptions() {
        console.log("in setUpGridOptions of ExtractorQueueGrid");
        var dataSource = new kendo.data.DataSource({
            transport: {
                read: this.configSetttings.DATACACHEAPI_EXTRACTORQUEUESERVICE_URL
            },
            error: function (e) {
                console.log("Status: " + e.status + "; Error message: " + e.errorThrown);
            },
            pageSize: this.constants.KENDO_GRID_DEFAULT_PAGE_SIZE,
            schema: {
                model: {
                    name: "ExtractorQueueGrid",
                    fields: {
                        queueId: { },
                        name: {},
                        addedDate: { type: "Date" }

                    }
                }
            }
        });
        this.options = {
            dataSource: dataSource,
            columns: [
                { field: "queueId", title: "QUEUEID", width: "8px" },
                { field: "name", title: "NAME", width: "20px" },
                { field: "addedDate", title: "ADDEDDATE", format: "{0:MM/dd/yyyy}", width: "10px" }
            ],
            pageable: true,
            groupable: true,
            sortable: true,
            selectable: true
           // click: "onChange",
        }
    }