要求JS、KendoUI和KnockoutJS有任何合作的机会

所以我想一起使用requirejs、kendo ui和knocket JS。

我读了Using Kendo with RequireJS和Knockout JS文章Asynchronous Module Definition（AMD）with RequireJS，然后我通过Knockout.JS和Kendo UI找到了Knockout Kendo库——一个强大的二人组，我心想——这太棒了——我即将进入一个彩虹、MVVM、AMD和HTML5的美丽世界。

但现在我似乎更像是身处一个充满痛苦和折磨的黑暗地下世界。这是交易。。。

我有一个简单的网站，有一个js文件夹，里面有以下内容：

jquery-2.0.3.min.js
敲除2.3.0.js
knockout-kendo.min.js
require.js
剑道ui/**此处的所有剑道文件

和一个index.html文件，我把它放在根目录中，其中包含以下内容：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="js/require.js"></script>
</head>
<body>
    <div id="grid" data-bind="kendoGrid: items"> </div>    
    <script type="text/javascript">            
        require.config({
            baseUrl : 'js',
            paths: {
                'jquery': 'jquery-2.0.3.min',
                'knockout': 'knockout-2.3.0',
                'kendo': 'kendo-ui',
                'knockout-kendo': 'knockout-kendo.min',
            },
            shim: {
                'jquery': {
                    exports: 'jQuery'
                }
            }            
        });        
        define('mainViewModel', ['knockout'], function (ko) {
            return function mainViewModel(){
                this.items = ko.observableArray([
                    { id: "1", name: "apple"},
                    { id: "2", name: "orange"},
                    { id: "3", name: "banana"}
                ]);
            };
        });    
        require(['jquery','knockout','mainViewModel','knockout-kendo'], 
            function($, ko, mainViewModel) {
                ko.applyBindings(new mainViewModel());
        });
    </script>
</body>
</html>

据我所知，这应该是基本正确的，但我得到了一个例外：

GET http://localhost/ko-kendo/js/kendo-ui.js [HTTP/1.1404 Not Found 1ms] 
Error: Script error for: kendo
http://requirejs.org/docs/errors.html#scripterror @http://localhost/ko-kendo/js/require.js:163

看起来淘汰剑道正在试图加载剑道-ui.js，但由于它不存在，它找不到它，这并不奇怪。

为了验证映射，我敲了一个：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="js/require.js"></script>
</head>
<body>
    <div id="grid" data-bind="kendoGrid: items"> </div>    
    <script type="text/javascript">            
        require.config({
            baseUrl : 'js',
            paths: {
                'jquery': 'jquery-2.0.3.min',
                'knockout': 'knockout-2.3.0',
                'kendo': 'kendo-ui',
                'knockout-kendo': 'knockout-kendo.min',
            },
            shim: {
                'jquery': {
                    exports: 'jQuery'
                }
            }            
        });        
        define('mainViewModel', ['knockout'], function (ko) {
            return function mainViewModel(){
                this.items = ko.observableArray([
                    { id: "1", name: "apple"},
                    { id: "2", name: "orange"},
                    { id: "3", name: "banana"}
                ]);
            };
        });    
        require(['jquery','knockout','mainViewModel','kendo/kendo.grid.min'], 
            function($, ko, mainViewModel) {
                var vm = new mainViewModel();            
                $(document).ready(function () {
                    $('#grid').kendoGrid({
                        dataSource: new mainViewModel().items()
                    });
                });            
                ko.applyBindings(vm);
        });
    </script>
</body>
</html>

这非常有效（好吧，它起到了作用）-你可以看到，两者之间的区别在于，在第二种情况下，我没有使用敲除kendo，因此，绑定不适用，这就是为什么我在文档准备功能中使用kendoGrid的原因。

那么，有人知道在这个绿色美丽的地球上，我如何才能在需要JS的情况下获得淘汰剑道吗？我觉得垫片可能有什么新奇的东西可以让它运转起来，但我无法解决。。。

Knockout Kendo被设置为依赖于kendo模块。最简单的方法是将kendo指向kendo.web文件，如：kendo: kendo.web.min（在kendo.web.min.js所在的任何目录中）。

相关内容

最新更新

热门标签：