Angularjs:排序在 Chrome 和 Firefox 浏览器中显示不同的结果

2024-05-07

您好,我在 chrome 和 firefox 浏览器中得到不同的数据排序结果。 Firefox 显示正确的一个。

HTML :

<table class="datatable">
              <thead>
                <tr>
                  <th width="5%" class="Rank">Rank&nbsp;<a ng-click="sort_by('Rank')"><i class="icon-sort" ng-show="pagedItems[currentPage].length > 1"></i></a></th>
                  <th width="10%" class="Interviews">Interviews&nbsp;<a ng-click="sort_by('Interviews')"><i class="icon-sort" ng-show="pagedItems[currentPage].length > 1"></i></a></th>
                  <th width="25%" class="Dealership">Dealership&nbsp;<a ng-click="sort_by('Dealership')"><i class="icon-sort" ng-show="pagedItems[currentPage].length > 1"></i></a></th>
                  <th width="15%" class="Satisfaction">Overall Satisfaction&nbsp;<a ng-click="sort_by('Satisfaction')"><i class="icon-sort" ng-show="pagedItems[currentPage].length > 1"></i></a></th>
                  <th width="15%" class="Loyalty">Loyalty&nbsp;<a ng-click="sort_by('Loyalty')"><i class="icon-sort" ng-show="pagedItems[currentPage].length > 1"></i></a></th>
                </tr>
              </thead>
              <tbody>
                <tr ng-repeat="item in pagedItems[currentPage] | orderBy:sortingOrder:reverse">
                    <td>{{item.Rank}} - {{item.$$hashKey}}</td>
                    <td>{{item.Interviews}}</td>
                    <td>{{item.Dealership}}</td>
                    <td>{{item.Satisfaction | number:1}}</td>
                    <td>{{item.Loyalty}}</td>
                </tr>
            </tbody>

我最初使用 Rank 进行排序:

角度控制器代码:

$scope.sortingOrder = sortingOrder;
$scope.reverse = false;

Firefox 中的结果:排名列显示带有哈希键值的排名

Chrome 结果:排名列显示带有哈希键值的排名

这里我用Rank排序。具有相同排名的数据按照 $$hashkey 排序。 Firefox 提供 $$hashkey 以便获取数据。 Chrome 在给出哈希键时将第二条记录放在最后。

我无法理解为什么会发生这种情况。有什么办法可以避免吗?

提前致谢。


我在谷歌浏览器中遇到了同样的问题。 补救措施是在页面加载时设置初始排序字段。

我以前没有这样做:

$scope.items = {[$data]}    



        $scope.mySortFunction = function(item) {
            if(isNaN(item[$scope.sortExpression]))
                return item[$scope.sortExpression];
            return parseInt(item[$scope.sortExpression]);
        }

我把上面的改成这样:

$scope.items = {[$data]}    

        //we want the 1st load to be sorted by sort_code
        $scope.sortExpression = 'sort_code';

        $scope.mySortFunction = function(item) {
            if(isNaN(item[$scope.sortExpression]))
                return item[$scope.sortExpression];
            return parseInt(item[$scope.sortExpression]);
        }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angularjs:排序在 Chrome 和 Firefox 浏览器中显示不同的结果 的相关文章

  • Angularjs 模式的复选框表现得很奇怪

    我有一个有角度的应用程序plunker http plnkr co edit rac8w9g8L0eX8mlXKuVn p preview 当我们单击该按钮时 它会打开一个包含项目列表的模式对话框 其中 2 项是根据复选框表输入中的条件进行
  • 此 JavaScript 如何在 Firefox 中打开 Windows 设置?

    新安装 Firefox 45 开发版后 我看到了这个页面 它有一个按钮 让我们开始吧 单击该按钮时 会以某种方式打开选择默认应用程序Windows 10 中的设置页面 这是怎么做到的 我无法通过开发者控制台在该页面上迷宫般的代码中找到任何内
  • 单元测试依赖注入

    我对茉莉花和业力是全新的 我相信我的环境设置正确 并且我能够运行非常基本的单元测试 但是一旦我尝试实例化控制器 我就会收到未知提供程序错误 并且我不确定如何调试它 我需要传入 stateProvider 依赖项吗 我在角种子示例中没有看到这
  • Swagger 生成 javascript-closure-angular-client

    我是 swagger 的新手 我从 swagger 的在线编辑器生成了一个 javascript 闭包角度客户端 它给了我一个 DefaultAPI js 和其他与我的对象定义匹配的 JS 文件 我在 swagger 文档和网上搜索了一种在
  • 以角度选择项目后保持菜单打开

    单击我的菜单后 我的菜单将关闭toggleShare按钮 我怎样才能防止这种情况 我将 angularJS 与 Angular 材料一起使用 这是我的代码
  • BUG - 在 IOS 中没有选择标签的完成按钮

    我正在使用最新的离子并有一个简单的选择标签
  • 根据用户区域设置过滤字符串列表

    当使用 AngularJS 1 6 处理 JavaScript 项目时 我有一个要过滤的字符串列表 例如 假设我的列表包含 rbol cig e a nido and tubo 当过滤西班牙语字符串时 如果我过滤 u 我会期望两者cig e
  • 通过 XSL 查看 XML 到 XHTML 转换中的源代码

    我正在尝试使用 XSL 文件将 XML 文件转换为 XHTML 文件 如何查看转换后输出的XHTML源代码 我目前正在通过 Firefox 查看结果 但我看到的只是 XHTML 文件的渲染版本 我想查看源代码 但是当我转到 查看 gt 页面
  • 如何销毁角度工厂实例

    一方面 我有几个工厂 每个工厂都控制一个 websocket 另一方面 其中一个工厂应该在客户端登录时启动 因此 if user isLogged injector get NotificationsWebsocket 这就是我动态初始化工
  • 链接无效

    我正在尝试使用以下命令创建一组指向页面中特定部分的链接 a href 符号 但它似乎不起作用 点击链接似乎没有任何反应right click gt open in a new tab更改 url 但不会移动到页面的其他部分 我使用的是火狐浏
  • Highcharts 对堆积条形图进行排序

    我没有看到任何与我在 Highcharts 中遇到的确切场景相匹配的解决方案 因此我将我的发现发布在这里 我在 Highcharts 中有一个堆积条形图 需要按值从大到小对条形图进行排序并维护它们的类别关系 通常 首选解决方案是在将数据发送
  • WebGL VS Canvas 2D 硬件加速

    这些天 我需要在画布上画很多图像 画布尺寸为800x600px 我有很多256x256px的图像 有些更小 在上面绘制 这些小图像将在画布上组成一个完整的图像 我有两种方法来实现这一点 首先 如果我使用canvas 2D上下文 那就是con
  • Angular UI 模式的范围问题

    我无法理解 使用角度 UI 模式的范围 虽然这里不是很明显 但我已经正确设置了模块和所有内容 据我所知 但这些代码示例尤其是我发现错误的地方 index html 其中重要部分 div class btn group div
  • Angular.js:如何从无序列表中获取 orderBy 或过滤器来工作?

    尝试根据价格和评级 在返回的对象中 进行排序 我宁愿用 ng click 和 li 来代替使用选择菜单 有没有办法做到这一点 我环顾四周 这是我能想到的最接近的 ul class restaurant filter li i class i
  • Android在排序列表时忽略大小写

    我有一个名为路径的列表 我目前正在使用以下代码对字符串进行排序 java util Collections sort path 这工作正常 它对我的 列表进行排序 但是它以不同的方式处理第一个字母的情况 即它用大写字母对列表进行排序 然后用
  • $exceptionHandler 中的 $location - 依赖冲突

    我正在尝试实现一个非常标准的任务 当发生异常时 重定向到我的 error page 代码的简化形式如下所示 app factory exceptionHandler location function location return fun
  • 仅当显式选择行时才关闭 ui-bootstrap typeahead

    我创建了这个jsBin http jsbin com livuqafe 2 edit来证明我遇到的问题 如果您转到此处 请尝试输入 五 并继续 你的自然反应是输入 五 然后按 Tab 如果你想要 五百 你可以向下箭头一次 但是 在这种情况下
  • jQuery:离线后 POST 出错(iOS 和 Chrome)

    我构建了一个具有离线功能的 HTML5 Web 应用程序 使用 AppCache 程序流程为 Online 在网络上时 应用程序预加载一些基本信息 工作 Offline 用户拿着装有应用程序的平板电脑offline 然后在应用程序上执行他们
  • 当共享相同的行和列时,将网格项设置为不重叠

    现在 当两个网格项共享相同的行和列时 它们会相互重叠 div class some grid container div Item 1 div div Item 2 div div 我如何让它们不重叠 当共享相同的行和列时 其行为可能类似于
  • Angular - 如何从 DOM 中删除我使用过 $compile 的元素?

    我需要的是两个 ng views 的功能 因为我不能 我想更改某些内容的innerHTML 并编译它 我遇到的问题是 当我再次更改内容时 我可以编译 但是 Angular 是否会自行删除绑定 或者我必须手动执行此操作 如果是这样 怎么办 编

随机推荐