以编程方式导航到本地剑道视图不起作用

Question

在 kendoUI 移动项目中，我使用最新的 kendo.all.min.js 文件 (2013.1.319) 和 JQuery 1.9.1，如文档中所述。在我的一个视图模型中，我试图显示第二个视图，但它失败了：

类型错误：l 为空

我有 2 个看起来像这样的视图：

<div id="MainView" data-title="My Group List" data-role="view" 
   data-model="listModel" data-layout="StandardLayout">
   .
   .
</div>

<div id="SelectedView" data-title="View Group" data-role="view" 
  data-model="selectedModel" data-layout="StandardLayout">
   .
   .
</div>

在第一个视图的模型中，我有这个：

var listModel = kendo.observable({

    groups: [],

    viewGroup: function (e) {
        selectedModel.set("group", e.data);

                //kendoMobileApp variable pointing to a
                //kendo.mobile.Application object
        kendoMobileApp.navigate("#SelectedView"); /* ERROR HERE */
    }

在上面列出错误的地方，我得到 TypeError l is null 错误。知道为什么吗？我的语法关闭了吗？尝试使用缩小的脚本进行调试令人沮丧，因为我所知道的调试版本不存在。

谢谢。

Answer 1

@布莱恩

确保将“kendoMobileApp”变量保持为全局变量。

HTML：

<div id="MainView" data-title="My Group List" data-role="view" 
   data-model="listModel" >
       <div>Main View</div>
       <div><a data-role="button" data-bind="click: navigateToSelected">Go to Selected view</a></div>
</div>

<div id="SelectedView" data-title="View Group" data-role="view" 
  data-model="selectedModel">   
      <div>Selected View</div>
       <div><a data-role="button" data-bind="click: navigateToMain">Go to Main view</a></div>
</div>

JavaScript：

var listModel =  kendo.observable({
    navigateToSelected: function(){
        kendoMobileApp.navigate('#SelectedView');
    }

});
var selectedModel =  kendo.observable({
    navigateToMain: function(){
        kendoMobileApp.navigate('#MainView');
    }
});

var kendoMobileApp = new kendo.mobile.Application();

查看从jsFiddle 导航的简单示例。 注意：我没有使用布局，因为这在这里并不重要。