【问题标题】:Kendo UI 2017 doesn't work with angular + angularAMD + requirejsKendo UI 2017 不适用于 angular + angularAMD + requirejs
【发布时间】:2017-09-19 07:13:28
【问题描述】:

Kendo UI 2017 似乎不适用于 requirejs + angular + angularAMD。但是当我切换到剑道 2015 版时,它工作正常。

关于如何克服这个问题的任何建议?

这是示例应用程序。 请注意 - 如果我将 kendo 版本更改为 2015,它可以工作。

https://plnkr.co/edit/DjOq6BfOVSHvIuSHliH8?p=preview

索引.html

<!DOCTYPE html>
<html>
<head>
       <script data-main="main.js" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js"></script>
       <link href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.common.min.css" rel="stylesheet" />
</head>
<body>
       <h1>Hello Plunker!</h1>
       <div kendo-tab-strip k-content-urls="[ null, null]">
              <ul>
                     <li class="k-state-active">First tab</li>
                     <li>Second tab</li>
              </ul>
              <div style="padding: 1em">
                     This is the first tab
              </div>
              <div style="padding: 1em">
                     This is the second tab
              </div>
       </div>
</body>
</html>

main.js

require.config({
       baseUrl: "",
       waitSeconds: 0,
       paths: {
              'jquery': 'https://code.jquery.com/jquery-2.1.3.min',
              'angular': 'https://code.angularjs.org/1.3.12/angular',
              'angularamd': '//cdn.jsdelivr.net/angular.amd/0.2/angularAMD.min',
              'kendo': 'https://kendo.cdn.telerik.com/2017.3.913/js/kendo.all.min',
              //'kendo' : 'https://kendo.cdn.telerik.com/2015.1.429/js/kendo.all.min'  --This version works
       },
       shim: {
              'angularAMD': ['angular'],
              'kendo': ['jquery', 'angular']
       },
       deps: ['application-configuration']
});

应用程序配置.js

define(['angularamd', 'kendo'], function (angularAMD) {
       var app = angular.module("mainModule", ['kendo.directives']);
       angularAMD.bootstrap(app);
       return app;
});

【问题讨论】:

    标签: angularjs kendo-ui requirejs angular-amd


    【解决方案1】:

    在引用require.js之后,添加这个代码块:

    <script>
      define.amd = null;
    </script>
    

    define.amd 是通知 javascript 库正在使用脚本加载器的标准方法。我还没有寻找线索,但我看到一些库检查 define.amd。从 Kendo UI 的文档https://docs.telerik.com/kendo-ui/third-party/using-kendo-with-requirejs 中,有一个声明表明 Kendo UI js 已经是 AMD 模块。

    The minified Kendo UI JavaScript files are AMD modules and work with compatible loaders such as RequireJS. You can use this feature to load only the needed Kendo UI JavaScript files instead of kendo.all.min.js.
    

    我的解决方法是让脚本认为不存在任何脚本加载器。希望对您有所帮助

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-10-09
      • 1970-01-01
      相关资源
      最近更新 更多