knockout.js 在Knockout foreach循环中编写HTML代码(通过Razor调用)

jhdbpxl9  于 2022-11-10  发布在  其他
关注(0)|答案(1)|浏览(170)

我的情况就是现在的情况:

<fieldset name="sortSearch">
    @Html.CreateSortingControl("views.restricted.widgets.alertdetailwidget.sorting", "searchCriteria.Sorting", "changeSortingDirection", "changeSortingField", GetValueList(SortingValueProvider.ValueProviderId))
</fieldset>

在实践中,我调用了一些CS代码,这些代码将创建一些带有下拉列表和绑定的标记。例如,当在下拉列表中选择一个值时,将调用函数changeSortingField。一切都正常工作。
问题是我想把这个标记封装在一个依赖于一个可观察对象的Knockout foreach循环中。

<!-- ko foreach: {data: FieldSortings, as: 'sortings' }-->
    <fieldset name="sortSearch">
        @Html.CreateSortingControl("views.restricted.widgets.alertdetailwidget.sorting", "searchCriteria.Sorting", "changeSortingDirection", "changeSortingField", GetValueList(SortingValueProvider.ValueProviderId))
    </fieldset>
<!-- /ko -->

这意味着当FieldSortings增加时,新的标记应该出现,而且确实出现了。问题是,使用这种逻辑,我的函数都不再被调用,比如当我从下拉列表中选择一个值时,绑定就不再起作用了,感觉就像标记只被计算了一次(我想)。我应该使用某种特定的组合来在飞行中调用剃刀功能吗?提前感谢!
EDIT:剃刀返回的标记为:

<div class="input-group custom-sort">
<section data-bind="validationElement: searchCriteria.Sorting.Field">
    <label class="select">
        <select data-i18n="[aria-label]accessibility.select.value" class="input-xs select-Sorting-Field" data-bind="value: searchCriteria.Sorting.Field,event: {change: changeSortingField}">
            <option value="" css="searchcriteria-sorting-field-">&lt;Select Order by&gt;</option>
            <option value="DetectionDate" data-default="true" css="searchcriteria-sorting-field-DetectionDate">Detection date</option>
            <option value="Impact" css="searchcriteria-sorting-field-Impact">Impact</option>
            <option value="Score" css="searchcriteria-sorting-field-Score">Score</option>
        </select>
        <strong class="tooltip tooltip-top-right">
            <i class="fa  txt-color-teal"></i>
            <span data-i18n="views.restricted.widgets.alertdetailwidget.sorting"></span>
        </strong>
    </label>
    <div class="note note-error" style="display: none;" data-bind="validationMessage: searchCriteria.Sorting.Field"></div>
</section>
<label class="input-group-addon" for="sorting-control" data-bind="click: changeSortingDirection">
    <span class="sr-only">Change the sorting direction</span>
    <input type="checkbox" name="sorting-control" id="sorting-control" data-bind="checked: searchCriteria.Sorting.IsDescending">
    <i></i>
</label>

FieldSortings是一个可观察数组,定义如下:

self.FieldSortings = ko.observableArray([]);
hfyxw5xn

hfyxw5xn1#

发现问题。在Knockout foreach循环中,您需要使用**$parent**来引用外部变量和函数。由于这个原因,它无法使绑定正常工作。

相关问题