angular中ng-repeat去重
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
<div ng-app="myApp" ng-controller="myCtrl">
<p ng-repeat="x in items | unique:'id'">
{{x.id}}---{{x.name}}
</p>
</div>
<script>
//AngularJs 自定义过滤器
//1.使用过滤器,去除重复
angular.module('common', []).filter('unique', function () {
return function (collection, keyname) {
console.info(collection);
console.info(keyname);
var output = [],
keys = [];
angular.forEach(collection, function (item) {
var key = item[keyname];
if (keys.indexOf(key) === -1) {
keys.push(key);
output.push(item);
}
});
return output;
}
});
var app = angular.module('myApp', ['common']);
app.controller('myCtrl', function ($scope) {
//$scope.items = [1, 2, 3,2];
//当前unique 的过滤只针对,对象数组过滤
$scope.items = [
{ id: 1, name: 'zhangsan' },
{ id: 2, name: 'lisi' },
{ id: 1, name: 'zhangsan' },
];
});
</script>
angular中ng-repeat去重的更多相关文章
- ui-router中的锚点问题(angular中的锚点问题)
angular.module('anchorScrollExample', []) .controller('ScrollController', ['$scope', '$location', '$ ...
- angular中的MVVM模式
在开始介绍angular原理之前,我们有必要先了解下mvvm模式在angular中运用.虽然在angular社区一直将angular统称为前端MVC框架,同时angular团队也称它为MVW(What ...
- angular源码分析:angular中的依赖注入式如何实现的
一.准备 angular的源码一份,我这里使用的是v1.4.7.源码的获取,请参考我另一篇博文:angular源码分析:angular源代码的获取与编译环境安装 二.什么是依赖注入 据我所知,依赖注入 ...
- angular中$cacheFactory缓存的使用
最近在学习使用angular,慢慢从jquery ui转型到用ng开发,发现了很多不同点,继续学习吧: 首先创建一个服务,以便在项目中的controller中引用,服务有几种存在形式,factory( ...
- 在 Angular 中实现搜索关键字高亮
在 Angular 中,我们不应该试图直接修改 DOM 的内容,当需要更新 DOM 内容的时候,应该修改的其实是我们的数据模型,也就是 $scope 中的数据,Angular 会帮助我们将修改之后的数 ...
- Angular中 build的时候遇到的错误--There are multiple modules with names that only differ in casing
今天早上遇到一个Angular的编译的时候的错误 具体信息: There are multiple modules with names that only differ in casing.This ...
- angular中的服务
angular中的服务 angular中的服务相当于一个状态管理,可以将数据放在服务里面进行获取以及编辑. 服务的安装命令: ng g service count 安装好后,会在服务的ts文件中引入一 ...
- Angular中ui-select的使用
Angular中ui-select的使用 最近工作一直很忙,没有时间整理知识,前几天项目中需要用到angular-ui-select,实现下拉框快速过滤效果,今天有时间研究了一下,终于搞明白了. 一. ...
- Angular中的内置指令和自定义指令
NG中的指令,到底是什么(what)? 为什么会有(why)?以及怎样使用(how)? What: 在NG中,指令扩展HTML功能,为 DOM 元素调用方法.定义行为绑定数据等. Why: 最大程度减 ...
- Angular中innerHTML标签的样式不起作用详解
1.背景 在最近angular的项目中,需要用到[innerHTML]标签来指定一个div的样式: //HTML部分 <div class="contents" [inner ...
随机推荐
- debug1: expecting SSH2_MSG_KEX_ECDH_REPLY解决
设置mtu ifconfig en1 mtu 1200 代理工具 退出lantern,退出shadowsocks
- Session 机制和 Cookie 机制
Session 机制和 Cookie 机制 HTTP协议是无状态的, 而Cookie和Session都是在无状态的基础上希望实现有状态的效果, 两者是在客户端或者是服务端使用缓存等手段来实现状态的维护 ...
- urllib基础-请求对象request
简单的案例-爬取百度首页 from urllib import request ''' 爬取百度首页 ''' # 确定爬去目标 base_url = 'http://www.baidu.com' # ...
- tcpdump简单使用
1.使用wincap将文件放入系统任意路径, 2.进入系统,赋文件可执行权限, 3.输入命令:./tcpdump -i eth0 -s 0 -w xxx.pcap 4.进行数据交互 5.退出程序运行, ...
- vue-awesome-swiper 插件
Swiper 版本区分了组件和普通版本 (1)npm install vue-awesome-swiper –save (2)在 main,js 里引入(全局): import VueAwesomeS ...
- 【Qt】2.2 继续了解信号和槽
槽和普通成员函数一样,可以是虚函数.被重载,可以是公有.私有.保护的.它可以被其它C++成员函数调用. 槽连接了信号,当发射这个信号时,槽会被自动调用. 连接函数: bool QObject::con ...
- CPP-基础:关于内存分配
1:c中的malloc和c++中的new有什么区别 (1)new.delete 是操作符,可以重载,只能在C++中使用.(2)malloc.free是函数,可以覆盖,C.C++中都可以使用.(3)ne ...
- ratio_to_report分析函数求占比
drop table test; create table test ( name varchar(20), kemu varchar(20), score number ); insert int ...
- 微信小程序 wx.request POST请求------中文乱码问题
问题: 一个简单的表单,提交后台返回数据“提交成功”. 以为没问题了,但是没过多久后台小哥就问为啥那么多乱码,找了很久原因,发现在提交的时候就已经乱码了. 嗯,前端问题,然后测试GET/POST方法. ...
- Vue的响应式规则
对象属性的响应规则 <body> <div id="root"> {{msg}} </div> </body> <script ...