Kendo MVVM绑定2源在同一个远程模板中

时间:2017-07-14 10:02:19

标签: mvvm kendo-ui telerik kendo-asp.net-mvc kendo-mvvm

我正在使用Kendo MVVM。这个ApisTemplate称为Remotely,它打开了。问题出在“PaxPreferenceTemplate”模板中。有2个源绑定。只有第一个工作,即细分。我不知道为什么。即使你使用

 <label data-bind:"text: Segment.SegmentDetailsToDisplayPricing" ></label>

结果仍然相同。如果我评论

<div data-bind="source: Segment"></div> 

然后第二行工作     请说出正确的方法

注意:以下所有代码都在1个文件中。

<script id="ApisTemplate" type="text/x-kendo-template" class="KendoExtTemplate">

    <div>
        <div data-bind="source: ApisVMList.PaxPreferenceBySegment" data-template="PaxPreferenceTemplate"></div>

        <div style="text-align:center;">
            <button type="button" id="btnIssueTicket" onclick="SaveIssueTicket(this)" class="k-button k-primary Apis_submit " style="width: 100px; height: 25px; margin-right: 5px;">
                <i class="fa fa-floppy-o fa-inverse" aria-hidden="true"></i> Save
            </button>

            <button type="button" class="k-button " onclick="CloseApisWindow(this)" style="width: 100px; height: 25px;"><i class="fa fa-ban"></i> Cancel</button>
        </div>
    </div>
</script>


<script id="PaxPreferenceTemplate" type="text/x-kendo-template" class="KendoExtTemplate">

    <div data-bind="source: Segment" data-template="SegmentTemplate"></div>

    <div data-bind="source: PaxInfo" data-template="PaxInfoTemplate"></div>

</script>

<script id="SegmentTemplate" type="text/x-kendo-template" class="KendoExtTemplate">
    <label data-bind="text: SegmentDetailsToDisplayPricing"></label>
</script>

<script id="PaxInfoTemplate" type="text/x-kendo-template" class="KendoExtTemplate">
    <div>
        <label data-bind="text: Pax.PersonName"></label>
        <input data-role="dropdownlist"
               data-text-field="PassportNumber"
               data-value-field="PassportNumberID"
               data-bind="source: PossiblePassports" />

        <input data-role="dropdownlist"
               data-text-field="FrequentFlyernumber"
               data-value-field="FrequentFlyernumberID"
               data-bind="source: PossibleFrequentFlyers" />
    </div>



</script>

1 个答案:

答案 0 :(得分:1)

我认为您必须划分模板,因为您有两种不同类型的列表和一个项目。

<script id="ApisTemplate" type="text/x-kendo-template" class="KendoExtTemplate">

    <div>
        <div data-bind="source: ApisVMList.PaxPreferenceBySegment" data-template="PaxPreferenceTemplate"></div>
 <div data-bind="source: ApisVMList.PaxPreferenceBySegment" data-template="PaxPreferenceTemplate_Second"></div>

        <div style="text-align:center;">
            <button type="button" id="btnIssueTicket" onclick="SaveIssueTicket(this)" class="k-button k-primary Apis_submit " style="width: 100px; height: 25px; margin-right: 5px;">
                <i class="fa fa-floppy-o fa-inverse" aria-hidden="true"></i> Save
            </button>
            <button type="button" class="k-button " onclick="CloseApisWindow(this)" style="width: 100px; height: 25px;"><i class="fa fa-ban"></i> Cancel</button>
        </div>
    </div>
</script>

<script id="PaxPreferenceTemplate" type="text/x-kendo-template" class="KendoExtTemplate">
    <div data-bind="source: Segment" data-template="SegmentTemplate"></div>
</script>
<script id="PaxPreferenceTemplate_Second" type="text/x-kendo-template" class="KendoExtTemplate">
    <div data-bind="source: PaxInfo" data-template="PaxInfoTemplate"></div>
</script>