等价于TypeScript中的JavaScript

Question

目前，我正在从事Durandal 2.0项目 。 最初，我是使用此JavaScript代码执行shell.js（ViewModel）的 ，它工作得很好。

初始JavaScript代码（有效的一种）

    define(['plugins/router', 'durandal/app'], function (router, app) {

    return {
        router: router,
        search: function() {
            app.showMessage('Search not yet implemented...');
        },
        activate: function () {
            router.map([
                { route: '', title:'Welcome', moduleId: 'viewmodels/welcome', nav: true },
                { route: 'flickr', moduleId: 'viewmodels/hello', nav: true }
        ]).buildNavigationModel();

            return router.activate();
        }
    };
    });

---

现在我正在尝试使用打字稿。 所以我写了这段代码（下面的代码），它不能工作打字稿代码：

    /// <reference path="../../Scripts/typescripts/jquery/jquery.d.ts" />
    /// <reference path="../../Scripts/typescripts/knockout/knockout.d.ts" />
    /// <reference path="../../Scripts/typescripts/durandal/durandal.d.ts" />

    import _config = require('config');
    import _router = require('plugins/router');
    import _app = require('durandal/app');

    class shell {
    //config = new _config.Config();
    app = _app;
    router = _router;

    activate() {
      this.router.map([
            { route: '', title: 'Welcome', moduleId: 'viewmodels/welcome', nav: true },
            { route: 'flickr', moduleId: 'viewmodels/hello', nav: true }
             ]).buildNavigationModel();
          return this.router.activate();
        }
    }

---

打字稿的输出：由TypeScript生成的JavaScript代码（无效）

    /// <reference path="../../Scripts/typescripts/jquery/jquery.d.ts" />
    /// <reference path="../../Scripts/typescripts/knockout/knockout.d.ts" />
    /// <reference path="../../Scripts/typescripts/durandal/durandal.d.ts" />
    define(["require", "exports", 'plugins/router', 'durandal/app'], function(require, exports, ___router__, ___app__) {

    var _router = ___router__;
    var _app = ___app__;

    var shell = (function () {
        function shell() {
            //config = new _config.Config();
            this.app = _app;
            this.router = _router;
        }
        shell.prototype.activate = function () {
            this.router.map([
                { route: '', title: 'Welcome', moduleId: 'viewmodels/welcome', nav: true },
                { route: 'flickr', moduleId: 'viewmodels/hello', nav: true }
        ]).buildNavigationModel();
            return this.router.activate();
        };
        return shell;
      })();
    });

---

谁能建议我这是什么问题？ 我得到的错误是

无法解析绑定。

绑定值：attr：{href：router.navigationModel（）[0] .hash}

消息：路由器未定义；

视图：视图/外壳；

ModuleId：viewmodels / shell

Answer 1

Durandal希望从模块返回该对象的实例。 Typescript的AMD约定是导出构造函数。 关于这个问题和插件解决方案的讨论在这里： https : //github.com/BlueSpire/Durandal/pull/244

我创建了Durandal v2.0插件来帮助解决问题：

https://gist.github.com/Jaben/6180861

它将为视图找到导出的类，并在可用的情况下使用它。

您还需要在TypeScript中将“ shell”类标记为export：

import _config = require('config');
import _router = require('plugins/router');
import _app = require('durandal/app');

export class shell {
    //....
}

Answer 2

谢谢大家的建议，但我已经通过在代码末尾创建类的新实例解决了问题，效果很好。

     return new shell();

在上课后添加了以上行。