远程数据源和远程视图+；MVVM

我试图在剑道移动应用程序（即非MVC）中分离我的视图和视图模型。我在ViewModel中有一个远程数据源，但无法使其工作-我确信这很简单（我找不到在ViewModel中使用远程数据源的剑道示例-它都是内联的。（，）

它只是显示了这个“函数（e）{var n=this；返回e==t？n.。(u data:（n.)数据=this.(n.)，n.(u ranges=[]，n.)addRange（n.)数据），n.(u total=n.(u data.length，n.(u data），t}”而不是实际数据

games.html视图

<div id="tabstrip-home"
     data-role="view"
     data-title="Games"
     data-model="app.gamesService.viewModel">

    <ul class="games-list"               
         data-bind="source: gamesDataSource"
         data-template="template">
    </ul>

</div>

<script type="text/x-kendo-template" id="template">
    <div class="product">
        <h3>#:ProductName#</h3>
        <p>#:kendo.toString(UnitPrice, "c")#</p>
    </div>
</script>

---

我找到了一个例子，并成功地实现了这一点，尽管javascript有点不同。我必须仔细阅读

(function (global) {
    var GamesViewModel,
        app = global.app = global.app || {};

    GamesViewModel = kendo.data.ObservableObject.extend({
        gamesDataSource: null,

        init: function () {
            var that = this,
                dataSource;

            kendo.data.ObservableObject.fn.init.apply(that, []);

            dataSource = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "http://demos.telerik.com/kendo-ui/service/Products",
                        dataType: "jsonp"

                        //ProductID":1,"ProductName":"Chai","UnitPrice":18,"UnitsInStock":39,"Discontinued":false

                    }
                }
            });

            that.set("gamesDataSource", dataSource);
        }
    });

    app.gamesService = {
        viewModel: new GamesViewModel()
    };
})(window);

---

ps-我真的不明白这里的区别-kendo.data.observeObject.extend这第二位代码似乎在扩展Init事件-我实际上需要在另一个事件上公开远程数据源（例如，单击按钮）

(function (global) {
    var GamesViewModel,
        app = global.app = global.app || {};

    GamesViewModel = kendo.data.ObservableObject.extend({
        gamesDataSource: null,

        init: function () {
            var that = this,
                dataSource;

            kendo.data.ObservableObject.fn.init.apply(that, []);

            dataSource = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "http://demos.telerik.com/kendo-ui/service/Products",
                        dataType: "jsonp"

                        //ProductID":1,"ProductName":"Chai","UnitPrice":18,"UnitsInStock":39,"Discontinued":false

                    }
                }
            });

            that.set("gamesDataSource", dataSource);
        }
    });

    app.gamesService = {
        viewModel: new GamesViewModel()
    };
})(window);