简单、基本的淘汰打字稿示例答案

【问题标题】：Simple, basic knockout typescript example简单、基本的淘汰打字稿示例
【发布时间】：2013-12-16 00:01:08
【问题描述】：

我只想让一个简单的打字稿淘汰示例工作。我已经使用 nugget 来获取 typescript 淘汰赛并下载了淘汰赛 3.0.0 js。这是我的打字稿文件

declare var ko;

class AppViewModel {
    firstName = ko.observable("Bob");
    lastName = ko.observable("Newhart");
}

ko.applyBindings(new AppViewModel());

这是我的html

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>TypeScript HTML App</title>
    <link rel="stylesheet" href="app.css" type="text/css" />
    <script type='text/javascript' src='Scripts/knockout-3.0.0.js'></script>
    <script src="AppViewModel.js"></script>     
</head>
<body>
    <p>First name: <strong data-bind="text: firstName"></strong></p>
    <p>Last name: <strong data-bind="text: lastName"></strong></p>
</body>
</html>

我是否正确引用了淘汰赛库？我正确调用 ko.applyBindings 吗？

为了完整起见，这里是生成的javascript

var AppViewModel = (function () {
    function AppViewModel() {
        this.firstName = ko.observable("Bob");
        this.lastName = ko.observable("Newhart");
    }
    return AppViewModel;
})();

ko.applyBindings(new AppViewModel());
//# sourceMappingURL=AppViewModel.js.map

【问题讨论】：

@Philip Scott Givens - 是的。你做得对。这是您的代码jsfiddle.net/mfVT5 的工作小提琴。您看到任何错误吗？您是否已验证浏览器中的源 HTML 是否包含所有 javascript？
"Cannot read property 'nodeType' of null" 在我调用 ko.applyBindings 时的淘汰赛 js 中
@user1，jsfiddle.net 中的“onLoad”是什么意思？我应该在我提供的代码中使用“onLoad”吗？

标签： javascript html knockout.js typescript

【解决方案1】：

我在这里用这个答案解决了这个问题：

https://stackoverflow.com/a/15090080/1226612

我将脚本标签移到了文件的末尾。

【讨论】：

@Philip Scott Givens - 很高兴你把它修好了。看起来您的脚本在加载 DOM 之前正在执行。如果您使用的是 Jquery，则可以将对 ko.applyBindings 的调用包装在 $( document ).ready() 函数中。
谢谢@user1。我会试试的。