对角度数据表中括号内的数字进行排序

2024-04-25

我在用角度数据表 http://l-lin.github.io/angular-datatables/根据网络服务响应填充我的表。我的网络服务返回一个如下所示的 json

[
 {
  "id": 1,
  "name" : "abc",
  "count": "(20)"
 },
 {
  "id": 2,
  "name" : "abc2",
   "count": "20"
 },
{
  "id": 3,
  "name" : "abc3",
  "count": "(30)"
 }
] 

我可以将 JSON 数组绑定到下表中的 $scope 变量

<table  datatable="ng" dt-options="dtOptions" dt-column-defs="dtColumnDefs">
     <thead>
             <tr> 
                 <th>id</th>
                 <th>name</th>
                 <th>count</th>
             </tr>
     </thead>

     <tbody ng-repeat= "item in items">
         <td> {{item.id}} </td>
         <td> {{item.name}} </td>
         <td> {{item.count}} </td>
     </tbody>
 </table>

The id and name列按升序和降序正确排序,但count列不是根据数字排序的。相反,它在排序和排序时考虑“(”。我希望计数列的排序结果为

在升序中

20

(20)

(30)

现在我按升序排列

(20)

(30)

20

谁能建议我需要应用什么逻辑?


您可以使用列渲染函数。当数据表需要值时count列,并希望使用该值sort列,然后传回包含列数据的数字部分的键入数字:

$scope.dtColumnDefs = [
   DTColumnDefBuilder
     .newColumnDef(2)
     .withOption('type', 'number')
     .renderWith(function(data, type, full) {
        if (type == 'sort') { 
           var value = data.match(/\d+/);
           if (value == null) {
              return 0
           } else {
              value = parseFloat(value[0]);
           } 
           return value.toString().length != data.length ? value+0.0001 : value;
        } 
        return data              
    })
]; 

这里我补充一下0.0001包含非法字符的值,例如(- 通过这样我们可以确保值以正确的顺序显示,即所有20已分组together在所有之前(或之后)(20).

演示->http://plnkr.co/edit/Zyp0yphHfxnElEjMMOh2?p=preview http://plnkr.co/edit/Zyp0yphHfxnElEjMMOh2?p=preview


注意:我会迭代<tr>'s, not <tbody> :

<tbody>
    <tr ng-repeat="item in items">
        <td> {{item.id}} </td>
        <td> {{item.name}} </td>
        <td> {{item.count}} </td>
    </tr>
</tbody>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

对角度数据表中括号内的数字进行排序 的相关文章

  • 将鼠标悬停时的鼠标光标更改为锚状样式

    如果我将鼠标悬停在div鼠标光标将更改为 HTML 锚点中的光标 我怎样才能做到这一点 假设你的div has an id myDiv 将以下内容添加到您的 CSS 中 这cursor pointer指定光标应与用于锚点 超链接 的手形图标
  • Javascript 函数查找数字的倍数

    创建一个名为的函数multiplesOf 它将接受两个参数 第一个参数是数字数组 第二个参数是数字 该函数应返回一个新数组 该数组由参数数组中的每个数字组成 该数字是参数数字的倍数 So multiplesOf 5 6 7 8 9 10 3
  • 渲染货币和符号并与来自不同单元格的数据相结合

    我正在使用最新的 jQuery DataTables v1 10 7 我正在尝试将数字解析为以下格式 239 90 USD 我可以使用此命令使货币正常工作 columns data Price render fn dataTable ren
  • 是否存在 IsCallable 为 false 但 IsConstructor 为 true 的 JS 对象?

    ECMAScript 规范函数可调用 https www ecma international org ecma 262 6 0 index html sec iscallable当且仅当其参数具有 Call 内部方法时返回 true 它在
  • AngularJS:Array.prototype.find() 在 Chrome 中不起作用

    我遇到一个问题 我的角度代码可以在 Firefox 中工作 但不能在 Chrome 中工作 浏览器控制台打印如下 TypeError undefined is not a function at setSelectedColor http
  • Javascript Promise“then”始终运行,即使 Promise 未能执行

    我希望当调用第二个 then 时不执行第三个 then 但是 即使 Promise 被拒绝 调用第二个 then 并且代码返回 rejected 然后返回 undefined 它仍然调用第三个 then 如何不运行第三个 then 这样 未
  • 以编程方式填写reactjs表单

    我正在编写一个用户脚本 但无法填写由reactjs制作的表单 我的代码 document querySelector id username value email protected cdn cgi l email protection
  • 如何在react-bootstrap中禁用表单提交的

    在下面的代码片段中 我有许多文本类型的输入表单 如果用户点击 我似乎会得到相同的合成事件 就像他们按下提交按钮一样 我想忽略作为表单提交 只允许一个人按下 提交 按钮 我删除了一些表单组以减少示例 在所有情况下 按钮或 ENTER 键 e
  • 摩卡 - Chai Karma“套件未定义”

    我对 jscript tdd 很陌生 遇到了问题 希望有人能告诉我我在做什么 在浏览器中运行测试 通过 HTML 文件 一切正常 通过节点和业力运行它们我得到以下异常 我想在 node js 主机的 karma 中使用 Mocha 和 Ch
  • 如何纠正流警告:解构(缺少注释)

    我正在编写一个小型 React Native 应用程序 并且正在尝试使用 Flow 但我无法在任何地方真正获得有关它的正确教程 我不断收到错误 destructuring Missing annotation 有关 station 这段代码
  • 设置 cookie 时中断 JavaScript 执行

    当设置 cookie 时 是否可以始终中断浏览器开发人员工具中的 javascript 执行 无需显式设置 JS 断点 document cookie 在 html head 块的开头添加此代码片段效果很好
  • 尝试将数据存储在点击器网站中

    我正在尝试存储一个名为的变量score无论何时刷新 您都会一次又一次地使用它 我不明白的是它的代码是什么 我尝试了一些方法 但似乎都不起作用 这是我的答题器网站 但是当我尝试使用 JavaScript 来存储它时 它不起作用window o
  • Javascript split 不是一个函数

    嘿朋友们 我正在使用 javascript sdk 通过 jQuery facebook 多朋友选择器在用户朋友墙上发布信息 但是我收到此错误friendId split 不是函数 这是我的代码 function recommendToFr
  • 刷新页面时保存用户的选择

    我目前有一个页面显示不同团队的数据 我有一些数据 用户可以单击使其处于 打开 或 关闭 状态 并为每个数据显示不同的图标 它基本上就像一个清单 只是没有物理复选框 我想记住哪些 复选框 已被选中 即使在用户刷新页面或关闭浏览器并稍后返回之后
  • DataTables row.add 到特定索引

    我正在替换这样的行项目 var targetRow entity row dataTable targetRow closest table dataTable DataTable dataTable row targetRow remov
  • 在 Javascript 中连接空数组

    我正在浏览一些代码 我想知道这有什么用处 grid push concat row 根据我的理解 它等同于 grid push row 为什么要大惊小怪 连接 你想使用 concat当您需要展平数组并且没有由其他数组组成的数组时 例如 va
  • 如何隐藏/禁用 Highcharts.js 中的图例框?

    我想问是否可以使用 HighCharts js 库隐藏图表中的所有图例框 var chart object chart renderTo render to type graph type colors graph colors title
  • 从 FileReader 设置背景图像样式

    我正在寻找一种解决方案 允许我从文件上传输入中获取文件并通过设置 document body style backgroundImage 来预览它 以下代码用于在 Image 元素中显示预览 function setImage id tar
  • JavaScript 相对路径

    在第一个 html 文件中 我使用了一个变量类别链接 var categoryLinks Career prospects http localhost Landa DirectManagers 511 HelenaChechik Dim0
  • 如何使用asm.js进行测试和开发?

    最近我读到asm js规范 看起来很酷 但是是否有任何环境 工具来开发和测试这个工具 这还只是处于规范阶段吗 您可以尝试使用 emscripten 和 ASM JS 1 并从侧分支在 firefox 构建中运行它 有关 asm js 的链接

随机推荐

  • 在 Android Studio MacOS 中清理项目时出现“ninja”错误

    我在 macos mojave 中使用 Android Studio 3 5 我有一个项目 在一个文件夹中包含 java 和 ndk 代码 我们称之为 project folder A 我复制了这个文件夹 将其重命名为 project fo
  • 将脚本库应用于时间轴

    这是我之前问题的后续 如果这个问题太复杂而无法在这里回答 我深表歉意 我试图能够在时间线视图中显示我的数据 我在这里找到了谷歌的时间线脚本 https developers google com chart interactive docs
  • 检查lua中是否存在目录?

    如何检查 lua 中是否存在目录 如果可能的话最好不使用 LuaFileSystem 模块 尝试做类似以下 python 行的事情 os path isdir path 这是一种在 Unix 和 Windows 上都适用的方式 无需任何外部
  • 从字符串中删除转义序列 '\' 以将其转换为 XmlDocument

    我有一个返回 struct 对象的 Web 服务 因此我得到以下 XML 字符串形式的响应 现在我需要将其加载到 XmlDocument 对象中 但如何删除字符串中的转义序列 每个 的 都会导致错误
  • AVPlayer - UILabel 在视频上不可见

    NSString urlPath NSURL videoUrl urlPath NSBundle mainBundle pathForResource fogLoop ofType mp4 videoUrl NSURL fileURLWit
  • Firebase 聚合属性值,无需获取所有相关文档

    我有以下 firebase 结构 company1 name Company One invoices invoice1 amount 300 currency EUR timestamp 1572608088 invoice2 amoun
  • 子类化 UICollectionViewCell 导致永远不会被选择

    我尝试对 UICollectionViewCell 进行子类化并从 nib 文件加载 id initWithFrame CGRect frame self super initWithFrame frame if self NSArray
  • 将 WebGL 应用程序部署为本机 iOS 或 Android 应用程序?

    有谁知道如何将 WebGL 应用程序部署为本机 iOS 或 Android 应用程序 商业中间件是可以接受的 但开放项目会更好 谢谢 作为 Joris 答案的延伸 这似乎是基于内森 德弗里斯的作品 http atnan com blog 2
  • 使用破折号显示 URL slug 时出现问题

    我为我的故事 URL 创建了一个带有破折号的 slug 例如 使用 slug 而不是 ID 来获取记录 https stackoverflow com questions 482636 fetching records with slug
  • 视频文件中的感兴趣区域

    这是我第一次在这里发帖 希望能得到积极的结果 因为我的研究已接近尾声 我想在我的代码中添加一个函数 该函数将仅处理视频文件的定义的感兴趣区域 我无法发布图片 因为我还没有声誉 但这里发布了同样的问题 gt http answers open
  • OpenCV的calcOpticalFlowPyrLK抛出异常

    一段时间以来 我一直在尝试使用 OpenCV 构建一个小型光流示例 除了函数调用 calcOpticalFlowPyrLK 之外 一切正常 该函数在控制台窗口中打印以下失败的断言 OpenCV错误 断言失败 mytype typ0 CV M
  • 将文本单词换行

    我使用下面的代码来包装长文本 由用户在文本区域中输入以进行评论 function addNewlines comments var result while trim comments length gt 0 result comments
  • 拖动并 connectToSortable 到 iframe 内的可排序 DIV 中

    我试图将一个元素从主页拖动到其中的 iframe 并在框架内使用可排序的 div 我能够使 div 可排序 并将可拖动的内容连接到可排序的内容 但元素放置的位置计算错误并在错误的位置排序 可能是因为iframe内的鼠标坐标与主页的位置不同
  • 数据列表验证中 Obj.length>0 错误

    我有一个脚本 我通过 tempmankey 在网站上运行它 该脚本基本上是在输入字段中插入数据列表 并根据数据列表选择的值更改其他输入值 code function bdi contains Truck No closest div nex
  • 如何检测Vista UAC是否启用?

    我需要我的应用程序根据是否启用 Vista UAC 来表现不同 我的应用程序如何检测用户计算机上的 UAC 状态 该注册表项应该告诉您 HKLM SOFTWARE Microsoft Windows CurrentVersion Polic
  • 定制 iPhone 键盘

    我需要 即客户要求 提供自定义键盘 供用户在文本字段和区域中输入文本 我已经有一些可以执行键盘操作并将测试附加到文本字段的东西 但是我想让它更通用并让它像标准的 iphone 键盘一样工作 即当用户选择可编辑文本控件时出现 目前我的控制器知
  • 使用 BrokeredMessage 从 Azure 服务总线队列 (v1) 反序列化强类型对象

    无论出于何种原因 我似乎无法弄清楚如何将我的对象从队列中取出并将其反序列化回它放入其中的内容 An账户事件DTO Azure函数成功将对象放入队列 FunctionName AccountCreatedHook public static
  • 从groupby中的列获取模式[重复]

    这个问题在这里已经有答案了 我试图获取 groupby 对象中列的模式 但出现此错误 incompatible index of inserted column with frame index 这是我遇到的问题 我不知道如何解决它 任何帮
  • 哪个类应该存储查找表? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 世界上有不同地点的代理 但任何地点都只有一个代理 每个特工都知道他在哪里 但我还需要快速检查给定位置是否有特工 因此 我还维护了一张从位置到代理
  • 对角度数据表中括号内的数字进行排序

    我在用角度数据表 http l lin github io angular datatables 根据网络服务响应填充我的表 我的网络服务返回一个如下所示的 json id 1 name abc count 20 id 2 name abc