淘汰排序似乎没有做任何事情

本文关键字：任何事 排序 淘汰 | 更新日期: 2023-09-27 18:17:58

我的设置如下…

我有一个服务，它将数据从存储过程返回到UI，没有特定的顺序。UI使用knockout将数据绑定到MVC部分，它看起来像这样…

@{ ViewBag.Title = "People List"; }
<h2>People List</h2>
<table id="people">
    <thead>
        <tr>
            <th>Name</th>
            <th>Gender</th>
            <th>Job Title</th>
            <th>Job Description</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: people">
        <tr>
            <td style="width: 125px;"><span data-bind="text: Name"></span></td>
            <td style="width: 75px;"><span data-bind="text: Gender"></span></td>
            <td style="width: 105px;"><span data-bind="text: JobTitle"></span></td>
            <td style="width: 300px;"><span data-bind="text: JobDescription"></span></td>
        </tr>
    </tbody>
</table>
<button style="margin-top: 15px;" data-bind="click: sortByName">Sort by Name</button>

虚拟机的JS是这样的…

<script type="text/javascript">
    function Person(data) {
        this.Name = ko.observable(data.Name);
        this.Gender = ko.observable(data.Gender);
        this.JobTitle = ko.observable(data.JobTitle);
        this.JobDescription = ko.observable(data.JobDescription);
    }
    function PersonListVM() {
        var self = this;
        self.people = ko.observableArray([]);
        $.getJSON('@Url.Action("DisplayPeople", "People")',
            function (results) {
                for (var i = 0; i < results.length; i++) {
                    self.people.push(new Person(results[i]));
                }
            });
        self.sortByName = function () {
            self.people.sort(function (x, y) {
                return x["Name"] == y["Name"] ? 0 : (x["Name"] < y["Name"] ? -1 : 1);
            });
        };
    };
    ko.applyBindings(new PersonListVM());
</script>

我可以毫无问题地获取和显示数据，甚至在VM函数中添加另一个虚拟人也不会出现问题。但按名字排序似乎没什么用。没有错误，但显然我做错了什么。这应该是一个非常简单的搜索，我错过了什么?

PS:我提供属性名称作为字符串的原因是因为我想使一个可排序的，分页网格的这个表，排序表标题。我的目标是能够传入任何有效的属性上的表可以动态排序，但这只是作为实验工作到它。

淘汰排序似乎没有做任何事情

即使你使用数组语法访问属性，它们仍然是ko.observables。你需要"展开"这个可观察对象来获取它的值。

试试这个:

return x['Name']() == y['Name']() ? 0 : (x['Name']() < y['Name']() ? -1 : 1);

刚刚离开我的头你有没有尝试使用点语法来访问人对象属性而不是数组语法?

self.people.sort(function (x, y) {
            return x.Name == y.Name ? 0 : (x.Name < y.Name ? -1 : 1);
        });
相关文章：