【问题标题】:knockout binding with Nested loop inside bootstrap table与引导表内的嵌套循环的淘汰赛绑定
【发布时间】:2015-09-04 01:58:58
【问题描述】:

上图显示了将数据与敲除数组绑定后的结果。然而,预期的结果并非如此。我想要下面的结果,如图所示

HTML 代码

<table class="table tableMini top10">
    <thead>
        <tr>
            <th>Workflow</th>
            <th style="width:190px;">Access</th>

        </tr>
    </thead>
    <tbody data-bind="foreach: Access_label">
        <tr>
            <td data-bind="text: $data.Application">
                <strong/>
            </td>
            <td>
                <input type="checkbox">
                </td>
            </tr>


            <tr>
                <td>
                    <table class="table tableMini top10">
                        <tbody data-bind="foreach: $data.ListAccessRights">
                            <tr>
                                <td data-bind="text: $data.Name">
                                    <span class="l45"/>
                                </td>
                                <td>
                                    <input type="checkbox">
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </td>


                </tr>
            </tbody>
        </table>

上图显示了来自服务器的响应

敲除js代码

GetRoleList: function () {
        var self = this
        $.ajax({
            type: "GET",
            url: '/Employee/GetRoleList',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: false,
            success: function (data) {
                self.RoleList(data.Roles);
                self.Roles_Type_list(data.RoleType);
                self.Campaign_Type_list(data.CampaignType);
                self.Access_label(data.AccessRight);
            },
            error: function (err) {

                alert(err.status + " : " + err.statusText);

            }
        });


    }

我想知道如何执行循环,以便获得想要的结果

【问题讨论】:

    标签: javascript jquery twitter-bootstrap model-view-controller knockout-2.0


    【解决方案1】:

    我会这样做:

    <table class="table tableMini top10">
        <thead>
            <tr>
                <th>Workflow</th>
                <th style="width:190px;">Access</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: Access_label">
            <tr>
                <td>
                    <strong data-bind="text: Application"></strong>
                </td>
                <td>
                    <input type="checkbox"/>
                </td>
            </tr>
            <!-- ko foreach: ListAccessRights -->
            <tr>
                <td class="l45" data-bind="text: Name"></td>
                <td>
                    <input type="checkbox"/>
                </td>
            </tr>
            <!-- /ko -->
        </tbody>
    </table>
    

    【讨论】:

    • 在我发送的 sn-p 中,我使用了基于 cmets 标签的无容器控制流语法来执行第二个循环( ... )。你可以在这里查看更多信息:knockoutjs.com/documentation/…
    • 我应该使用什么 html 元素来执行第二个循环。如果我放置
      标记并执行循环,则不会显示数据。所以,我关心的是我应该使用什么 html 标签来执行循环???
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-10-07
    • 1970-01-01
    • 1970-01-01
    • 2013-10-31
    • 1970-01-01
    • 2013-05-31
    • 2013-03-08
    相关资源
    最近更新 更多