我有一个表,其中包含对象的列表myListB()
,这些对象由knockout foreach
显示,行数与myListB().Count
一样多。
<!--ko with: myProperty-->
<table class="table">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
</tr>
</thead>
<tbody>
<!-- ko foreach: myListB()-->
<tr>
<td data-bind="text: Property1"></td>
<td data-bind="text: Property2"></td>
@await Html.PartialAsync("~/Views/MyView.cshtml", this)
</tr>
<!-- /ko -->
</tbody>
</table>
<!-- /ko -->
数据模型:
class viewmodel{
public myProperty:Foo;
}
class Foo{
public myListB: KnockoutObservableArray<Model1> = ko.observableArray([])
public myPropertyA:string;
}
class Model1{
public Property1:any;
public Property2:any;
}
是否有方法将项目从foreach传递到局部视图MyView.cshtml(它将是Model1
类型对象),因此我可以在局部视图中将其用于data-bind
,并访问数组myListB()
中每一项的Property1
值。正如用代码编写的那样, myProperty
由ko with
传递,因此在局部视图中,我可以访问整个myListB()
或myPropertyA
。使用ko with: $data
Package 局部视图没有帮助,我仍然只能访问myPropertyA
和整个myListB()
。我无法在此处删除foreach和局部视图,它应该保持原样,问题是关于从foreach到partial视图的数组项的数据绑定的可能性
MyView.cshtml:
<div class="modal"
role="dialog">
<div class="modal-dialog"
role="document">
<div class="modal-content ">
<div class="modal-header">
<h4 class="modal-title">MyTitle</h4>
</div>
<!--ko if: $data!=null -->
<div class="modal-body ">
<span data-bind="text: $data.Property1"></span>
</div>
<!-- /ko -->
</div>
</div>
</div>
1条答案
按热度按时间6ovsh4lw1#
您尝试执行的操作的问题在于,knockoutjs在客户端浏览器中运行,而
@await Html.PartialAsync
在服务器上运行。当knockoutjs处理myListB
的内容时,服务器已经处理了部分视图并将其呈现为html,作为表行的一部分。因此我认为您在客户端看到的浏览器内容如下所示。
第一个
我可以看到的部分问题是部分视图被添加到表的中间,浏览器很难正确地呈现表。
如果您在局部视图周围添加一个
<td></td>
标签,那么表格将正确呈现。第一个