我有一个看看热毛巾模板,并试图让它在打字稿工作中,我遇到了一个问题转换壳视图模型。 我试着翻译成TS这一点,它更有意义,我认为这应该是一个类,如图所示,而不是简单地导出函数在这里 。 我看着这个方法 ,但是,要注意的意见在这里 ,决定不跟随它。
有点挖后,我发现这个线程 ,这表明它应该是作为压倒一切的简单router.getActivatableInstance
,但我似乎无法获得足够远为函数曾经被调用。
这里是我的main.ts
(一类也包裹起来):
/// <reference path="dts/toastr.d.ts" />
/// <reference path="dts/durandal.d.ts" />
/// <reference path="dts/require.d.ts" />
import _app = module('durandal/app');
import _system = module('durandal/system');
import _viewLocator = module('durandal/viewLocator');
import _router = module('durandal/plugins/router');
import _logger = module('services/logger');
export class HOPS {
public init(): void {
_logger.log('init', this, 'HOPS', false);
_system.debug(true);
this._startApp();
}
private _startApp(): void {
_logger.log('_startApp', this, 'HOPS', false);
_app.start().then(() => {
toastr.options.positionClass = 'toast-bottom-right';
toastr.options.backgroundpositionClass = 'toast-bottom-right';
var defImpl = _router.getActivatableInstance; //default Implementation
_router.getActivatableInstance = function (routeInfo: _router.routeInfo, paramaters: any, module: any) {
var functionName = routeInfo.name.substring(0, 1).toUpperCase() + routeInfo.name.substring(1);
if (typeof module [functionName] == 'function') {
var instance = new module [functionName]();
instance.__moduleId__ = module.__moduleId__;
return instance;
}
else return defImpl(routeInfo, paramaters, module );
}
_router.handleInvalidRoute = (route: _router.routeInfo, paramaters: any) => {
_logger.logError('No Route Found', route, 'main', true);
}
_router.useConvention();
_viewLocator.useConvention();
_app.adaptToDevice();
_app.setRoot('viewmodels/shell', 'entrance');
});
}
}
var hops: HOPS = new HOPS();
hops.init();
(游乐场表示这里JS: http://bit.ly/WyNbhn )
......这是我的shell.ts
:
import _system = module('durandal/system');
import _router = module('durandal/plugins/router');
import _logger = module('services/logger');
export class Shell{
public router = _router;
public activate(): JQueryPromise {
_logger.log("activate", null, 'shell', false);
return this.boot();
}
public boot(): JQueryPromise {
_logger.log("boot", null, 'shell', false);
this.router.mapNav('home')
this.router.mapNav('details');
_logger.log('SciHops SPA Loaded!', null, _system.getModuleId(this), true);
return this.router.activate('home');
}
}
...这编译为:
define(["require", "exports", 'durandal/system', 'durandal/plugins/router', 'services/logger'], function(require, exports, ___system__, ___router__, ___logger__) {
/// <reference path="../dts/_references.ts" />
var _system = ___system__;
var _router = ___router__;
var _logger = ___logger__;
var shell = (function () {
function shell() {
this.router = _router;
}
shell.prototype.activate = function () {
_logger.log("activate", null, 'shell', false);
return this.boot();
};
shell.prototype.boot = function () {
_logger.log("boot", null, 'shell', false);
this.router.mapNav('home');
this.router.mapNav('details');
_logger.log('SciHops SPA Loaded!', null, _system.getModuleId(this), true);
return this.router.activate('home');
};
return shell;
})();
exports.shell = shell;
})
通过上面的类,我得到一个绑定错误,因为router
是不确定的。 如果我加export var router = _router
那么这个错误就会消失,但在我的壳类的激活方法不会被调用。
所有上述工作以及后续的ViewModels的,只是跌倒在外壳上。
我在做什么错了,我怎样才能得到一个TS类工作作为我的壳迪朗达尔视图模型?