javascript - 尝试从可观察数组中获取特定元素

Question

我正在尝试从 observablearray 中获取特定值。在此示例中，我试图获取我在数组中创建的两个值的数量。

我把代码设置成这样:

HTML

<div id="test" style="width: 100%">
    <table style=" width: 50%; display: block; float: left; margin: 0; padding: 0; border: none">
        <tr>
            <td>Item 1</td>
            <td><span data-bind="text: someArray()[0].number"></span></td>
        </tr>
        <tr>
            <td>Item 2</td>
            <td><span data-bind="text: someArray()[1].number"></span></td>
        </tr>
        </table>
</div>

JavaScript

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js" type="text/javascript"></script>
<script src="https://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js" type="text/javascript"></script>
<script type="text/javascript">
    var viewModel = {
        someArray: ko.observableArray([]) //
    }

    ko.applyBindings(viewModel);

    $(function () {
        getData();
    });

    var getData = function () {
        viewModel.someArray([
            { 
                number: 123,
                text: "abc"
            },
            { 
                number: 456,
                text: "def",
            }
        ]);
    }
</script>

我也已经上传到 JSfiddle 了。

如何访问数组中的特定位置？

Answer 1

以下作品:

var viewModel = {
  someArray: ko.observableArray([]) //
}


var getData = function () {
  viewModel.someArray.push(
    {number: 123,text: "abc"},
    {number: 456,text: "def"},
    {number: 789,text: "ghi"}
  );
}

getData();
ko.applyBindings(viewModel);

您将一个数组插入 viewModel.someArray 而不是 3 个单独的对象。您还必须在插入数组对象后应用绑定(bind)，否则当 someArray 中没有行时您将得到无法解析绑定(bind)异常。

您可能会考虑使用 foreach 绑定(bind)来更好地满足您的需求 Knockout Foreach Binding 。然后你可以随时调用 applyBindings 。如果数组中有您不想要的其他行，请从您确实想要的索引中创建一个 computed observable 数组，并围绕它构建一个 foreach 绑定(bind)。