javascript - 基本 knockout 示例 "data-bind"不起作用

标签 javascript knockout.js

我正在尝试将 knockout.js 教程中的一些代码转换为我的 Visualstudio asp.net 项目。

我认为一切都设置得很好,我使用 Bower 添加了 knockout 库依赖项。

我只想让一些代码能够使用 knockout 。这是我所拥有的:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>

        <p>First name: <strong data-bind="text: firstName"></strong></p>
        <p>Last name: <strong data-bind="text: lastName"></strong></p>
    <script src="lib/knockout/dist/knockout.js" type="text/javascript">
            function AppViewModel() {
                this.firstName = "Devin";
                this.lastName = "Salemi";
            }
            // Activates knockout.js
            ko.applyBindings(new AppViewModel());
    </script>
</body>
</html>

当我访问该网站时,我看到的只是 名字:

姓氏:

所以实际值没有出现,即使我在 JS 中设置了它们。它应该读作—— 名字:德文

姓氏:萨莱米

在 IDE 中,非常确定所有函数都链接得很好,例如当我编写 ko 时。 IDE 为我提供了所有选项,所以我认为我已经安装好了库...

最佳答案

您需要将自定义 JavaScript 包装在单独的 <script> 中标签。

每当有src=""时在 script 标签上,它只是忽略内部内容,并从 src 文件加载。因此,您需要另一个不带 src 的脚本标记。所有自定义脚本的属性:

<p>First name: <strong data-bind="text: firstName"></strong></p>
<p>Last name: <strong data-bind="text: lastName"></strong></p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js" type="text/javascript">
</script>
<script>
  function AppViewModel() {
    this.firstName = "Devin";
    this.lastName = "Salemi";
  }
  // Activates knockout.js
  ko.applyBindings(new AppViewModel());
</script>

关于javascript - 基本 knockout 示例 "data-bind"不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42378341/

相关文章:

javascript - 如何在真实设备上捆绑和部署 React-Native iOS 应用程序

javascript - 在 JavaScript 中对表格进行排序 - 隐藏没有后续行的表格行

jquery - 调用knockoutjs postJson后如何收到JSON响应?

javascript - knockout js选择的选项

javascript - knockout 延期问题 - 更好的解决方案?

javascript - Processingjs Firefox 错误 : "TypeError: $it2.hasNext is not a function"

javascript - 如何在 Laravel 5 的页面上按当前表格打印数据?

javascript - ajax 表单提交使用什么返回类型?

javascript - 如何使用 textInput 绑定(bind)触发函数?

javascript - 将 Kendo Grid 与 knockoutjs 行模板一起使用使过滤变得不可能