如何使 Typescript 和 Knockout.js 与 MVC 应用程序一起工作

Question

将淘汰赛 .js viewModel 绑定到 MVC 问题。

我尝试遵循至少 5 个教程，但它们看起来各不相同，对我来说没有任何效果。我在构建应用程序时没有遇到任何错误。

TS 文件：

/// <reference path="../typings/knockout/knockout.d.ts" />
/// <reference path="../typings/jquery/jquery.d.ts" />

export module HopCRM {
    export class ContactViewModel {
        text: string = "Test";
        public test: KnockoutObservable<string>;

    constructor() {
        console.log("hello")
        this.test = ko.observable("Test testing testing")

    }             
}

}

我的 CSHTML：

<h2 data-bind="text: test">Waiting for viewModel</h2>

<script src="~/Scripts/Typescript/ContactViewModel.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1        /jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script>

<script type="text/javascript">
    var viewModel;
    (function () {
        viewModel = new HopCRM.ContactViewModel();
        ko.applyBindings(viewModel);  
    });
</script>

我期待 public 测试或至少简单 console.log

的绑定

Answer 1

为了使用导出和模块，需要使用 webpack。如果你不需要这样的复杂性，那么尝试只使用类而没有任何 export/imports:

你的ts文件：

class ContactViewModel {
        text: string = "Test";
        public test: KnockoutObservable<string>;

    constructor() {
        console.log("hello")
        this.test = ko.observable("Test testing testing")

    }             
}

用法（在 cshtml 中）：

const viewModel = new ContactViewModel();
ko.applyBindings(viewModel);

查看我的工作fiddle：https://jsfiddle.net/koljada/dgnyspwa/3/

如何使 Typescript 和 Knockout.js 与 MVC 应用程序一起工作

How to make Typescript and Knockout.js working with MVC application

model-view-controller

knockout.js

typescript