所需援助转换了jQuery角 [英] Assistance needed converting jQuery to Angular

问题描述

我们有一个使用这种code通过jQuery AJAX填充表：

We have a table that is populated via jQuery ajax using this code:

$.ajax({
    type:  "POST",
    cache: false,
    url:   "/files/event_lister.php", // script that gets data from
                                      // DB and responds with JSON sample shown below
    data:  input_data,
    dataType: "json",
    success: function(data) {
        var html = "";
        $.each(data["events"], function(id, event) {
            course_url = "/courses/" + group_titles[event["ProgramGroup"]] + 
                         "/" + url_titles[event["ProgramCode"]] + "/" +
                         event["EventCode"] ;
            html += "<tr>" +
            "          <td>" + event["Course_Type"] + "</td>" +
            "          <td>" + event["FormalDate"] + "</td>" +
            "          <td>" + event_lookup[event["ProgramCode"]] + "</td>" +
            "          <td>" + (parseInt(event["Price"]) > 0 ? "$" + parseInt(event["Price"]) : "&nbsp;") + "</td>" +
            "          <td class="nb">" +
            "            <a href=\"" + course_url + "\">Details</a>" +
            "        </td>" +
            "      </tr>";
        });
        if (html ==  "") {
            html="<tr><td colspan=5 class="fullspan"><p>No Results to display.</p></td></tr>";
        }
        $("#events_tbody").html(html); // #events_body is tbody of table
    }
});

我试图修改此拨弄发现样品code使用我的数据：

I am trying to modify the sample code found in this fiddle to use my data:

http://jsfiddle.net/SAWsA/11/

http://jsfiddle.net/Mrbaseball34/aEypQ/

有在上面列出的第二小提琴JSON数据...

There is JSON data in the second fiddle listed above...

<table class="table table-striped table-condensed table-hover">
    <thead>
    <tr>
        <th class="lb">Location<a ng-click="sort_by('Course_Type')"><i class="icon-sort"></i></a></th>
        <th width="75px">Date<a ng-click="sort_by('FormalDate')"><i class="icon-sort"></i></a></th>
        <th>Program<a ng-click="sort_by('Program')"><i class="icon-sort"></i></a></th>
        <th>Cost</th>
        <th>Information</th>
    </tr>
    </thead>
    <tfoot>
    <td colspan="6">
        <div class="pagination pull-right">
            <ul>
                <li ng-class="{disabled: currentPage == 0}">
                    <a href ng-click="prevPage()">« Prev</a>
                </li>
                <li ng-repeat="n in range(pagedItems.length)"
                    ng-class="{active: n == currentPage}"
                    ng-click="setPage()">
                    <a href ng-bind="n + 1">1</a>
                </li>
                <li ng-class="{disabled: currentPage == pagedItems.length - 1}">
                    <a href ng-click="nextPage()">Next »</a>
                </li>
            </ul>
        </div>
    </td>
    </tfoot>
    <tbody>
    <tr ng-repeat="item in pagedItems[currentPage] | orderBy:sortingOrder:reverse">
        <td>{{item.Course_Type}}</td>
        <td>{{item.FormalDate}}</td>
        <td>{{item.Program}}</td>
        <td>{{item.Price}}</td>
        <td>{{item.Info}}</td>
    </tr>
    </tbody>
</table>

数据是不可编辑的双向这样是不是一个问题。我们只填写表格和他们course_url链接，用户点击的过程中添加到我们的购物车。

Data IS NOT editable so bidirectional is not a concern. We only fill the table and them the user click on the course_url link to add the course to our shopping cart.

推荐答案

下面是一个工作 plunker 但还没有成型的搜索，你可以解决它你自己的。结果
希望这有助于。

Here's a working plunker but the search not working yet, you can fix it on your own.
Hope this help.

这篇关于所需援助转换了jQuery角的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！