javascript – ng-repeat中的AngularJS“标题”

我有一个问题,最近出现的问题多于一个,我想知道最好的方法.简单说明一下:

我有数据显示在ng-repeat中,按特定项目排序.比如说它按名称排序.我的目标是在字母顺序列表中的字母处打开标题

----A----
Abe Lincoln
Adam Smith
----B----
Barack Obama
Barry Zuckercorn
----C----
...

等等.

我尝试过的事情包括

>让控制器完全重建模型的数据,手动将其放入一组字母组中.例如,我的服务有一系列“帖子”,我的控制器在服务更新时,手动将这些“帖子”洗牌为“letterGroups”数组.然后可能只有两个嵌套的ng-repeats

但是,这依赖于对数据的大量操作,并且不容易改变数据的动态排序.

>当模型更新时,让控制器通过手动单步执行数据来“填充”数据,检查字母何时更改,并在该元素上搭载“header”属性(post.header = true).然后ng-repeat可以检查它当前所在的元素是否是标题,并使用ng-if将其他内容插入到DOM中.

这感觉稍微干净但是由于ng-repeat的工作方式,标题元素必须“包含”在与ng重复元素相同的水平.例如,如果你在< tr>上进行ng-repeat.元素,这意味着不可能插入另一个< tr>对于标题,因为特殊元素必须出现在< tr>内.

最后,沿着与上面相同的方向:

>让控制器维护一个“关键索引”列表 – 这样做的好处是不像上面的第二种方法那样修改数据,但通常以相同的方式工作.

编辑:

我写了一篇here博客文章,解释了我最终如何处理这个问题 – 感谢由Ian在下面的回答链接的Google Groups讨论.

解决方法

创建角度过滤器.它可以接受排序列表,按第一个字母对其进行分块,并为每个块返回一个对象,其中包含字母和以该字母开头的对象数组.

请参阅例如chunk by size filter here.特别注意有关为分块值创建哈希值的讨论.

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...