KnockoutOut JS - 为什么这些值无法正确绑定？ [英] KnockoutOut JS - why are these values not binding correctly?

问题描述

我有这个knockout可观察的数组，我试图把它的一些值绑定到我的看法。我遇到困难是因为它的嵌套。我不知道正确的数据绑定语法是什么。

这是我的可观察数组数据：

我想在广告客户中绑定advertiserName。

这是我的HTML

  < table id =tblBrand> 
< thead> 
< tr> 
< th>品牌名称< / th> 
< th> 
< button data-bind ='click：$ root.addBrand'>添加品牌< / button>< / th> 
< / tr> 
 
< / thead> 
< tbody data-bind =foreach：brands> 
< tr> 
< td> 
< input data-bind =value：brandNamereadonly =true/> 
< / td> 
< / tr> 
< tr> 
< td> 
< table> 
< tr> 
< td> 
< input data-bind =value：advertiser.advertiserName/> 
< / td> 
 
< td> 
< input data-bind =value：advertiser.advertiserRank/> 
< / td> 
< / tr> 
< / table> 
< td> 
< a href ='＃'data-bind ='click：$ root.removeBrand'style =color：blue> Remove< / a> 
< / td> 
< / tr> 
< / tbody> 
< / table> 
  

我的绑定工具的方式是在每个品牌内部查找。每个品牌都有一个广告主对象，我想深入研究。

解决方案

因为您的广告客户是 ko.observable 您需要使用 advertiser（）获取其价值，如果您在表达式：

 < table> 
< tr> 
< td> 
< input data-bind =value：advertiser（）。advertiserName/> 
< / td> 
< td> 
< input data-bind =value：advertiser（）。advertiserRank/> 
< / td> 
< / tr> 
< / table> 
  

或者您可以使用 与绑定：

 < table data-bind =with：advertiser> 
< tr> 
< td> 
< input data-bind =value：advertiserName/> 
< / td> 
< td> 
< input data-bind =value：advertiserRank/> 
< / td> 
< / tr> 
< / table> 
  

I have this knockout observable array and I am trying to bind some of its values to my view. Where I am having difficulties is because its nested. I am not sure what the correct data-bind syntax is.

This is my observable array data:

I want to bind advertiserName within advertiser.

This is my HTML

<table id="tblBrand">
        <thead>
            <tr>
                <th>Brand Name</th>
                <th>
                    <button data-bind='click: $root.addBrand'>Add Brand</button></th>
            </tr>

        </thead>
        <tbody data-bind="foreach: brands">
            <tr>
                <td>
                    <input data-bind="value: brandName" readonly="true" />
                </td>
            </tr>
            <tr>
                <td>
                    <table>
                        <tr>
                            <td>
                                <input data-bind="value: advertiser.advertiserName" />
                            </td>

                            <td>
                                <input data-bind="value: advertiser.advertiserRank" />
                            </td>
                        </tr>
                    </table>
                    <td>
                        <a href='#' data-bind='click: $root.removeBrand' style="color: blue">Remove</a>
                    </td>
            </tr>
        </tbody>
    </table>

The way my binding works is I am looking within each brand. Each brand has an advertiser object and I want to drill into that. The second screenshot shows my syntax and what the page renders.

解决方案

Because your advertiser is ko.observable you need to get its value with advertiser() if you are using it inside an expression:

<table>
   <tr>
       <td>
           <input data-bind="value: advertiser().advertiserName" />
       </td>
       <td>
           <input data-bind="value: advertiser().advertiserRank" />
       </td>
   </tr>
</table>

Or you can use the with binding:

<table data-bind="with: advertiser">
   <tr>
       <td>
           <input data-bind="value: advertiserName" />
       </td>
       <td>
           <input data-bind="value: advertiserRank" />
       </td>
   </tr>
</table>

这篇关于KnockoutOut JS - 为什么这些值无法正确绑定？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！