Question

由于我遇到了问题，通过简单的测试，我回到原始的Telerik页面，该页面显示了聚合物应用中的kendo组件的集成它看起来像任何一个例子（它很简单，因为有一个Dojo链接...）不起作用，至少对于当前版本的剑道。
我错过了什么？安德烈
P.S。：页面是这一页：http://docs.telerik.com/kendo-ui/third-party/webcomponents

更新：

我可以通过以下方法获取剑道网格的行为：

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="shared-styles.html">

<script src="../telerik/js/kendo.all.min.js"></script>
<script src="../telerik/js/kendo.webcomponents.js"></script>

<dom-module id="my-view2">

  <link rel="import" type="css" href="../telerik/styles/kendo.common.min.css">
  <link rel="import" type="css" href="../telerik/styles/kendo.default.min.css">
  <link rel="import" type="css" href="../telerik/styles/kendo.default.mobile.min.css">

  <template>

    <style include="shared-styles">
       :host {
        display: block;

        padding: 10px;
      }
    </style>

    ...

  <div id="grid"></div>
  ...


  ready: function () {
    var element = $(this.$.grid).kendoGrid({
      dataSource: [
        { Id: 1, Name: 'Pamela Andersson' },
        { Id: 2, Name: 'Naomi Campbell' },
        { Id: 3, Name: 'Monica Bellucci' }
      ],
      sortable: true,
      filterable: true,
      selectable: true
    });
  }

但我无法获得正确应用的样式。即使官方文档说它已被弃用，它仍然可以工作，包括你可以在代码中看到的外部样式表（任何其他'位置'打破代码......）。所以例如排序工作，但我看不到正确的图标当我尝试过滤时，表单看起来没有样式，并且在窗口的topleft角落......

Answer 1

我在Telerik guide的第一步后重现了你的症状。控制台指示在服务器上找不到特定于Kendo的Web组件脚本：

虽然Chrome不需要webcomponentsjs polyfill，但是他们的polyfill版本可能会对Kendo UI正常运行所需的修改。

我建议向剑道团队提交支持请求。

Answer 2

我已经在Kendoui-core-components上发布了Kendo UI Core的Web组件包装，使Kendo UI（用于jQuery）可以通过html元素属性进行初始化，例如：

<k-auto-complete id="customers"
                       data-text-field="ContactName"
                       data-source='{
                         type:"odata",
                         transport:{
                           read:"https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"},
                           group:{field:"Country"}
                          }'
                       heigth="400"
                       style="width:100%"></k-auto-complete>

您可以通过“ npm i kendoui-core-components”安装软件包。同时，我还编写了一个VSCode扩展，称为“ vsc-kendo-core-components”，该扩展提供了自动完成功能，可用于编辑元素属性。希望这两个派生使Kendo UI for jQuery更加直观和有效。

Kendo UI + Web组件

2 个答案: