1

好的一点背景,我正在尝试使用 Visual Studios 新的多设备混合应用程序项目设置将 kendo-mobile 与 typescript 一起使用。我有一个名为 main.ts 的文件,其中包含以下代码:

/// <reference path="../typings/require.d.ts" />

import MyApplication = require('../app/MyApplication');
var App: MyApplication;   

document.addEventListener("deviceready", function ()
{    
   App = new MyApplication();
}, false);

kendo 应用程序的初始化发生在 MyApplication 构造函数中。同样在同一个构造函数中,我传入初始视图,以便剑道应用程序知道首先显示哪个视图。下面是 MyApplication 类的代码。

/// <reference path="../typings/require.d.ts" />

import PrimaryController = require("../app/controllers/PrimaryController");

class MyApplication
{
    KendoApp: kendo.mobile.Application;
    PrimaryController: PrimaryController;

    constructor()
    {
        this.InitializeControllers();
        this.InitializeKendoApp();
    }

    private InitializeControllers()
    {
        this.PrimaryController = new PrimaryController(this);
    }

    private InitializeKendoApp()
    {
        var appOptions: kendo.mobile.ApplicationOptions = {};
        appOptions.initial = this.PrimaryController.View;
        appOptions.layout = "app-layout";
        appOptions.transition = "slide";

        this.KendoApp = new kendo.mobile.Application($(document.body), appOptions);
    }
}

export = MyApplication;

所以在我的 index.html 中,我也有这个对 requirejs 的调用,它应该调用 main.js 并实例化我的全局 App 变量。

<script src="scripts/frameworks/require.js" data-main="scripts/app/main.js"></script>

现在,在我试图在主 div 上显示 (primaryview.html) 的视图中,我将 data-show 属性设置如下:

data-show="App.PrimaryController.OnViewShow"

当存在 data-show 属性时,我收到一条错误消息,提示“无法读取未定义的 'PrimaryController' 的属性” - 即我的全局 App 变量永远不会被实例化。

如果我删除 data-show 属性,那么它“显示”App 变量被实例化,因为 primaryview.html 按预期显示,并且如前所述,我在 MyApplication 的构造函数中设置初始视图。我对实例化是否发生的唯一疑问是因为我在 main.ts 中设置了断点,但即使删除了数据显示并显示了视图,它们也从未命中。

有人对这里发生的事情有任何想法吗?我想也许我需要在 main.ts 中包含对 require.config() 的调用,我尝试使用从谷歌搜索中找到的示例进行设置,但没有任何效果。

4

1 回答 1

3

一旦您做出导入语句,您的文件就会被包裹在 adefine中,并且文件中的全局变量不再是全局变量,windowso 上可用:

import MyApplication = require('../app/MyApplication');
var App: MyApplication;  

应用程序不在窗口上。

您可以执行以下操作以放入窗口:

document.addEventListener("deviceready", function ()
{    
   (<any>window).App = new MyApplication();
}, false);
于 2014-06-13T04:22:48.297 回答