将动态变量传递给bind-data

时间:2012-12-10 11:00:06

标签: knockout.js

使用knockout.js时,我遇到嵌套foreach的问题。以下是说明

MyViewModel(){
   filteredRecords();
   columns();
}

RecordModel(){
   A,
   B,
   C
}

ColumnModel{
   Visible,
   ColumnName
}

要求是,如果column.Visible == 1,则在ReportModel中显示相应的ColumnName。在data-bind =“value:records.column.Column_Name()中,我尝试获取正确的路径但尚未成功,请给我一些建议 非常感谢。


<div>
<!-- ko foreach: {data: filteredRecords(), as: 'records'}  -->
   <ul class="tableBody">
      <li class="firstLevel">
          <ul>
              <li class="col col01"># : <span data-bind="text: records.ID"></span></li>                            
                 <!-- ko foreach: {data: $parent.columns(), as: 'column'} -->
                     <!-- ko if: column.Visible() == 1 -->

                          <li class="col col0"><input class="input0" **data-bind="value: records.column.Column_Name()"** /></li>  

                  <!-- /ko -->
                 <!-- /ko -->              
           </ul>
       </li>
    </ul>
<!-- /ko --> 
</div>     enter code here

1 个答案:

答案 0 :(得分:3)

<ul data-bind="foreach: { data: filteredRecords, as: 'record' }">
    <li><strong>#</strong> : <span data-bind="text: ID"></span>
        <ul data-bind="foreach: { data: $root.columns, as: 'column' }">
            <!-- ko if: column.Visible -->
            <li>
                <strong data-bind="text: column.ColumnName"></strong>:
                <span data-bind="text: record[column.ColumnName()]"></span>
            </li>
            <!-- /ko -->
        </ul>
    </li>
</ul>​

如果您愿意,可以将内部<ul>换成<!-- ko -->

http://jsfiddle.net/MizardX/K7Lzs/