6

这是我的第一篇文章,祝我好运:)

我想用热毛巾(durandal)+打字稿,我跟着这些线程:-how -can-i-use-a-class-for-my-shell-viewmodel-in-durandal - how-to-use-fancybox- in-combination-with-durandal-en-typescript -不正确的this-in-select

并且还尝试了 DurandalTypescriptExample示例

此示例未运行并出现此错误:

“'/'应用程序中的服务器错误。

无法找到该资源。"

起初我决定只用打字稿改变我的视图模型,然后在那个shell之后,但在这两种情况下我都得到了这个错误:

这是我的 shell.ts 代码(我从这个示例中使用):

/// <reference path="../durandal/durandal.d.ts" />

import _router = module('durandal/plugins/router');
import app = module('durandal/app');

export var router = _router;

export function search() {
    app.showMessage('Search not yet implemented...');
}
export function activate() {
    return router.activate('welcome');
}

我得到了这个错误:

- JavaScript runtime error: 'exports' is undefined

任何的想法?

如果可能的话,可行的解决方案将受到赞赏。

thanx 伙计们,让我们看看会发生什么。

4

4 回答 4

5

我对 DurandalTypescriptExample 有同样的问题。然而,这个项目中的代码演示了如何在视图模型文件中实现你的打字稿代码,如果你只确保公开处理 durandal 所需的变量。至少激活函数和标题变量。

请参见下面的代码示例:

/// <reference path="../../dts/knockout/knockout.d.ts" //>
export class ViewModel {
    title: string =  'Home View';
    MyTitle: KnockoutObservableString; //MyTitle can be referenced in home.html as vm.MyTitle
    public activate() {
         this.MyTitle = ko.observable(this.title + " with my ko title");
         return true;
    }
}

export var vm = new ViewModel();
//The Durandal plugin-interface variables
export var title = vm.title;
export var activate = function () { return vm.activate(); };

因为我发现没有现成的项目来证明这一点,所以我不得不自己做。在 github 上查看我的 Hot Towel 项目版本:

https://github.com/Svakinn/TypeTowel

于 2013-06-10T11:05:47.563 回答
3

如果您在全局范围内导出某些内容,则您处于外部模块领域,并且您需要第三方库来管理您的模块。

我推荐你使用 RequireJS。基本上是以下打字稿:

export function f(){
}

生成以下js:

function f() {
}
exports.f = f;

exports是由第三方模块加载器定义的变量。如果您没有这样的模块加载器,则导出是未定义的。我的教程进一步解释了它。

于 2013-05-19T10:59:35.930 回答
2

我发现将类导出为 requirejs/durandal 模块更容易。通过使用以下导出语句:

    export = ClassName;

这允许我们实现接口,甚至可以扩展视图模型基类(不确定扩展部分),而无需为我们想要包含在模块中的每个函数重复 export xxx... 代码。

试试看。

一个工作示例:

    // Durandal "test" view model definition using typescript
    import dialog = require("plugins/dialog")

    class Test {
        title: string = 'test';

        public activate() {
            dialog.showMessage("the test is working!");
            return true;
        }
    }

    // Instead of using code like:
    // export var instance = new Test();
    // export var activate = function() { return instance.activate(); }
    // .. more Durandal specific overrides...

    // Simply use...
    export = Test;
于 2013-11-27T23:42:31.063 回答
1

我为 Durandal v2 创建了一个插件,它支持按约定加载视图(ModuleId 或 ModuleId+“View”)。它可以在此处作为要点提供:https ://gist.github.com/Jaben/6180861

于 2013-08-11T14:24:19.387 回答