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

Question

我正在尝试在剑道移动应用程序（即不是MVC）中分离我的视图和视图模型。我在 ViewModel 中有一个远程数据源，但无法让它工作 - 我确定这很简单（我找不到在 ViewModel 中使用远程数据源的剑道示例 - 它都是内联的。（http://demos.telerik.com/kendo-ui/web/mvvm/remote-binding.html、http://docs.telerik.com/kendo-ui/getting-started/framework/datasource/overview）

它只显示这个"函数（e）{var n=this;return e===t？n._data：（n._data=this._observe（e），n._ranges=[]，n._addRange（n._data），n._total=n._data.length，n._process（n._data），t）}"，而不是实际数据。

游戏.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>

游戏.js视图模型

(function (global) {
    var GamesViewModel, app = global.app = global.app || {};
 
    GamesViewModel = kendo.data.ObservableObject.extend({
                                                            gamesDataSource: new kendo.data.DataSource({
                                                                                                           transport: {
                                                                    read: {
                                                                                                                   url: "http://demos.telerik.com/kendo-ui/service/Products",
                                                                                                                   dataType: "jsonp"
                                                                                                               }
                                                                }
                                                                                                       })
                                                             
                                                        });
    app.gamesService = {
        viewModel: new GamesViewModel()
    };
})(window);

Answer 1

我找到了一个示例并设法使其工作，尽管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);