0

我正在通过 Visual Studio 的 Icenium Extension 使用 Kendo UI Mobile。我对此很陌生,但我一直在磕磕绊绊。我在获取一些数据(读取文件夹中的文件名)并返回这些文件名的视图中编写了一个方法(称为 popDataSource)。如果我将它连接到按钮单击事件,该方法可以完美运行,但我真正想要的是在页面首次加载时调用该方法。我尝试设置 data-show=popDataSource 甚至 data-after-show=popDataSource,但是当我尝试返回数据时,我得到错误 Object [object Object] has no method 'set'。我也不太精通javascript,我敢肯定这对我没有任何帮助。

这是我的代码:

来自 index.html 的片段:

<div id="tabstrip-listSonicImages" data-role="view" data-title="Sonic Images List"    data-model="app.listSonicImagesService.viewModel" 
    data-after-show="app.listSonicImagesService.viewModel.popDataSource">    
    <div data-role="content" class="view-content">
        <div data-role="scroller">
            <div class="buttonArea">
                <a id="btnShowList" data-role="button" data-bind="click: popDataSource" 
class="login-button">Display List</a>
            </div>
            <ul class="forecast-list" data-role="listview" data-bind="source: sonicImagesDataSource" data-template="sonic-image-list-template">
            </ul>
        </div>
    </div> 
</div> 

<script type="text/x-kendo-tmpl" id="sonic-image-list-template">
    <a data-role="listview-link" href="\#tabstrip-playSonicImage?fileName=${fileName}">${fileName}</a> 
</script>

listiconimages.js

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

    SonicImageListViewModel = kendo.data.ObservableObject.extend({
        popDataSource: function () {
            var that = this;
            var listSI = new Array();

            try{
                window.requestFileSystem(LocalFileSystem.PERSISTENT, 0,
                    function (fileSys) {
                        fileSys.root.getDirectory("SIData", { create: true, exclusive: false},
                            function (dataDirEntry) {
                                var directoryReader = dataDirEntry.createReader ();
                                directoryReader.readEntries(
                                    function (entries) {
                                        var rows =  entries.length;
                                        for (i = 0; i < rows; i++) {
                                            var fName = entries[i].name;
                                            listSI[i] = { "fileName": fName, "image": "xxx" };
                                        }
                                    },
                                    function (error) {
                                        alert("error: " + error.code);
                                    }
                                );
                             },
                             null);
                         },
                         null
                     );

                    var dataSource = new kendo.data.DataSource(
                        {
                            data: listSI,
                            filter: { field: "fileName", operator: "endswith", value: ".simg" }
                        }
                    );

                    that.set("sonicImagesDataSource", dataSource);

                } catch (ex) {
                    alert(ex.message);
                }
            }
        });

        app.listSonicImagesService = {
            viewModel: new SonicImageListViewModel()
        };
    }
)(window);

应用程序.js

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

    document.addEventListener("deviceready", function () {
        app.application = new kendo.mobile.Application(document.body, { layout: "tabstrip-layout" });
    }, false);

    app.changeSkin = function (e) {
        if (e.sender.element.text() === "Flat") {
            e.sender.element.text("Native");
            mobileSkin = "flat";
        }
        else {
            e.sender.element.text("Flat");
            mobileSkin = "";
        }

        app.application.skin(mobileSkin);
    };
})(window)

正如我所说,我是 Icenium 和 Kendo 的新手,我的 JavaScript 知识有限,所以我不太确定答案在哪里。任何帮助将不胜感激。

谢谢

4

0 回答 0