Question

我有3个单独的div。第一个div绑定到主视图模型 - QuoteSimpleSearchVM

第二个div QdetailsDiv 绑定到主视图模型 - QuoteSimpleSearchVM

第三个div LineItemresult 绑定到observableArray ProductDetailsArrObj 这是在SimpleSearchResults对象中。

主视图模型 - QuoteSimpleSearchVM有一个可观察的数组 - simpleSearchResultsArray。在选择simpleSearchResultsArray的数组元素之一时，调用方法BindDataToQuotesDetailVM和BindProductsDetails。方法BindProductsDetails-填充数组 - ProductDetailsArrObj。

假设我选择了第一个simpleSearchResultArray元素 - 然后 simpleSearchResultArray（）[0] .ProductDetailsArrObj 必须绑定到div- LineItemresult

所以整个结构看起来像：

QuoteSimpleSearchVM --> simpleSearchResultsArray()[0] --> ProductDetailsArrObj.

如何绑定simpleSearchResultsArray()[0]的{{1}}进行查看？我使用了ProductDetailsArrObj＆amp;其他情况下为$root。无法解决当前方案中的此问题。

将可观察数组 ProductDetailsArrObj 绑定到视图时出错。这是视图代码：

$parent

查看型号代码：

<div id="searchResultQuotes" data-bind="visible: $root.showResultTable">
    <div id="resultTable">
        <table id="my-table">
            <thead id="resultTableHeader">
                <tr data-bind="foreach: gridOptions.columns">
                    <th data-bind="visible: checked, text: header">
                    </th>
                </tr>
            </thead>
            <tbody id="resultTableBody" data-bind="foreach: simpleSearchResultsArray">
                <tr>
                    <td>
                        <span data-bind="text: $index()+1"></span>
                    </td>
                    <td>
                        <span data-bind="text: jobName"></span>
                    </td>
                    <td>
                        <span data-bind="text:qName"></span>
                    </td>
                    <td>
                        <a  style="margin-left: auto; margin-right: auto; border: none; background: transparent;box-shadow: none;" data-role="button" data-icon="table_view" data-iconpos="notext" style="text-decoration: none; top: 1%" data-bind="click:function(){ $root.ShowQuotesDetails(qName);}"></a>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>


<div id="QdetailsDiv" >
    <div>
        <div>
            <div>
                <span>Job Name</span></div>
            <div>
                <input type="text" id="txtQDJobName" data-bind="value:jobName" /></div>
        </div>
        <div>
            <div>
                <span>Scenarios</span></div>
            <div>
                <input type="text" id="txtScenarioDescription" data-bind="value:scenarios" /></div>
        </div>
    </div>
</div>

<div id="LineItemresult">
    <div class="result">
        <table>
            <thead>
                <tr>
                    <th style="text-align: center">
                        <b>column 1</b>
                    </th>
                    <th style="text-align: center">
                        <b>column 2</b>
                    </th>
                    <th style="text-align: center">
                        <b>column 3</b>
                    </th>
                </tr>
            </thead>
            <tbody id="LineItemTemplateBody" data-bind="foreach: ProductDetailsArrObj">
                <tr>
                    <td>
                        <span data-bind="text:Line"></span>
                    </td>
                    <td>
                        <span data-bind="text:HighLevel"></span>
                    </td>
                    <td>
                        <span data-bind="text:Designation"></span>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

QuoteSimpleSearchVM-是主视图模型。

单击+符号视图，作业名称，方案和列与视图模型数据绑定，方法BindDataToQuotesDetailVM，BindProductsDetails被调用以绑定数据。我收到一个引用错误：无法解析绑定。消息：ReferenceError：未定义ProductDetailsArrObj; 绑定值：foreach：ProductDetailsArrObj

任何人都可以帮我解决这个问题吗？相同的jsfiddle链接：http://jsfiddle.net/ynV35/45/

Answer 1

将viewModel绑定到HTML使其在knockout上下文中成为$ root，并且变量和方法变为$ data。您不能再按名称调用它。在这种情况下，绑定到div的viewModel部分是一个数组的解决方案是使用foreach: $data而不是foreach: ProductDetailsArrObj。

更新前

OLD回答

这是淘汰赛中最常见的错误。简单的错误类型，名称或结构更改会导致无法解析绑定的消息。你必须学会自己解决这个问题，否则你不会对knockoutjs走得太远。 KO足以为您提供应在HTML中搜索的变量名称。

您的ProductDetailsArrObj位于另一个对象SimpleSearchResults内部，因此它应该与命名空间中的完整路径或foreach循环内部一起使用，因为SimpleSearchResults是一个项目数组。你说HTML绑定了不同的视图，但你的JS说的是不同的东西。

这在淘汰赛中称为上下文。您可以在KO文档中阅读更多相关信息：http://knockoutjs.com/documentation/binding-context.html

可观察数组 - 引用错误 - knockout.js

1 个答案: