从 javascript 代码调用 typescript 函数答案

【问题标题】：Call typescript function from javascript code从 javascript 代码调用 typescript 函数
【发布时间】：2015-11-17 19:02:46
【问题描述】：

由于 IE10 及以下版本的限制，我必须重新创建我创建的导入/上传功能，因为不支持 FileReader。我决定使用 iFrame 来满足使用旧浏览器上传的要求。

我的表格：

<form id="file_upload_form" method="post" enctype="multipart/form-data" action="upload.php">
    <input name="file" id="file" size="27" type="file" /><br />
    <input type="submit" id="import" value="Import" /><br />
</form>

我的 JavaScript。我没有完成 javascript 代码 sn-p，因为我意识到如果我直接调用该操作，我必须进行更大的返工。

$('#import').click(function () {
    $('#imageForm').submit();

    $('#iFrameImage').load(function () {
        $('#file').val('');
        $.get('ImportExportController/Put');
    });
});

请参阅下面的代码，我的控制器中的操作正在由打字稿调用。以前我可以直接使用ng-click然后调用这个方法。

 public Import(xml, parentNode): restangular.IPromise<any> {
        var vr = {
            IsOk: false,
            Data: [xml, somethinghere],
            Errors: []
        };
        return this.restangular.one('Import', '0').customPUT(vr);
    }

我需要使用 javascript 调用这个打字稿函数（这是我的角度视图模型），不幸的是我不知道如何。

概念是能够通过 iFrame 上传文件，然后在 Upload 上调用 Typescript 函数。

【问题讨论】：

您的 Typescript 将在客户端呈现为 javascript。看看它是如何呈现并调用你的函数的。
Calling properly TypeScript code from JavaScript的可能重复

标签： javascript jquery angularjs asp.net-mvc typescript

【解决方案1】：

Typescript 被编译成 javascript，所以这可以像调用 javascript 函数一样完成。话虽如此，结构可能会与您的预期有所不同，我了解其工作原理的最佳方法是将 Typescript 文件与从中编译的 javascript 文件进行比较。如果您在 typescript 中有模块/类，它们将成为调用函数的路径的一部分。示例：

class Foo{
    constructor(){}

    public Bar = () : string =>{
        return "This is a string";
    }
}

module FooModule {
    export var FooInstance = new Foo();
}

要在 typescript 或 javascript 中调用它（前提是您已正确导入页面）。

FooModule.FooInstance.Bar();

【讨论】：