0

我正在做SPA。我正在使用 RequireJS 和剑道路由。

define(['kendo'],function(kendo) {

router.route("/SomePage/", function () {
            require(['MyViewModel', 'text!MyTemplate'], function (viewModel, view) {
                loadView("#main-content", viewModel, view);
            });
        });
var loadView = function(container, viewModel, view) {
            var kendoView = new kendo.View(view, { model: viewModel });
                layout.showIn(container, kendoView);
        };
}

（上面的代码工作得很好）

服务器通过可观察对象的响应填充了剑道网格。网格中的每一行都有按钮，用于打开模式窗口。在窗口中会动态生成单选按钮组。

所以，我有 MyViewModel.js

define(['GridDataSource','RadioBtnDataSource'],function(ds, ds2){

    var GridViewModel = kendo.observable({
        gridDS: ds,

        openModalWin: function (e) {

           var modalWindow = $("#actions-modal-window").kendoWindow({}).data("kendoWindow").open();
           modalWindow.center();

           //radiobuttons view model
           var actionsViewModel = kendo.observable({

              //actions: ds2
              actions: [
                  { id: "id1", lable: "Send to black hole" },
                  { id: "id2", lable: "Shred" }
              ]
           });

           kendo.bind($("#radioBtnGroup"), actionsViewModel);
        }
    });

return cileGridViewModel;
});

这是我的 html 模板：

 <div class="panel-body"><

                <div id="cile-table"
                     data-role="grid"
                     data-editable="window"
                     data-bind="source: gridDS"
                     data-columns='[
                     {"field": "ID"},
                     {"field": "Name"},
                     {"template":"<a href=\"\\#/SomePage/\" data-bind=\"click: openModalWin \">Open</a>"},
                 ]'></div>

                <div id="actions-modal-window"
                     data-role="window"
                     data-visible="false"
                     data-modal="true"
                     data-width="55%"
                     data-height="600">

                        <ul data-bind="source: actions" data-template="ul-template" id="radioBtnGroup"></ul>

                        <script id="ul-template" type="text/x-kendo-template">
                            <li>
                                <input type="radio" name="hcEnd" id="hc1" data-bind="attr: {id: id}" />
                                <label data-bind="attr: {for: id}, text:lable"></label><br />
                            </li>
                        </script>
                </div>
        </div>
</div>

有带数据绑定的 li kendo 模板。

当我使用 jsfiddle 它工作：http: //jsfiddle.net/kuba_vaclavik/kEqYh/212/

但在我的项目中，它返回错误“Uncaught TypeError: undefined has no properties”。可能，将 viewModel 与无序列表或嵌套的可观察对象绑定存在问题，但我无法修复它。请问，有人可以帮忙吗？我的方法可能是错误的，所以我欢迎不同的方法。

4

1 回答 1

0

解决了。 无序列表错过了 data-role="listview"。可能在SPA中是必要的

<ul   data-role="listview"   data-bind="source: cilActions " data-template="ul-template" id="radioBtnGroup"></ul>
于 2014-09-12T14:49:16.773 回答