Question

好的，我可能正在做一些非常愚蠢的事情，这使我不能让它发挥作用，但无论如何都要进行：

我正在尝试学习如何使用knockout并尝试构建一个选项列表，其中选项被定义为可观察数组。这是代码：

<!DOCTYPE html>
<html>
    <body>
        <script type="text/javascript" src="./knockout-3.0.0.js"></script> 
        <script type="text/javascript"> 
            var viewModel = {
                availableQuestions : ko.observableArray(['Who?', 'What?', 'When?']) 
            };

            ko.applyBindings(viewModel);
        </script>
        <p>Questions to Ask: <select data-bind="options: availableQuestions"></select></p>
    </body>
</html>

这基本上是出于他们自己的一个例子，但我无法让它发挥作用。根本没有填充选择列表。我使用的是最新版本的Chrome（31.0.1650.57），并查看了开发人员工具以查看是否存在问题。我已经确认一切正常加载（即：敲除加载，html有效）仍然没有。我错过了一些明显的东西吗？

这是小提琴：

http://jsfiddle.net/janarde/r9pCK/

修改

感谢PW Kad事实证明，在绑定之前没有加载DOM：

修改感谢Ek0nomik指出需要在标记之后添加淘汰内容。

<!DOCTYPE html>
<html>
    <body>
        <script type="text/javascript" src="./knockout-3.0.0.js"></script> 
        <script type="text/javascript" src="jquery-1.10.2.min.js"></script>
        <p>Questions to Ask: <select data-bind="options: availableQuestions"></select></p>
        <script type="text/javascript"> 
            var viewModel = {
                availableQuestions : ko.observableArray(['Who?', 'What?', 'When?']) 
            };

            ko.applyBindings(viewModel);
        </script>
    </body>
</html>

Answer 1

您需要确保致电applyBindings。这是一个有效的jsFiddle：http://jsfiddle.net/b4wHQ/

<强> HTML

<p>Questions to Ask: <select data-bind="options: availableQuestions"></select></p>

<强>的Javascript

var viewModel = {
    availableQuestions : ko.observableArray(['Who?', 'What?', 'When?']) 
};

ko.applyBindings(viewModel);

Answer 2

在尝试应用绑定之前，您确定已加载DOM吗？

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="./knockout-3.0.0.js"></script> 
    </head>
    <body>
        <p>Questions to Ask: <select data-bind="options: availableQuestions"></select></p>

    <script type="text/javascript">
        $( document ).ready(function() {
            var viewModel = {
                availableQuestions : ko.observableArray(['Who?', 'What?', 'When?']) 
            };

            ko.applyBindings(viewModel);
        }); 
    </script>
    </body>
</html>

敲除选项绑定无法正常工作

2 个答案: