AngularJS的ng-repeat显示属性名和属性值
代码下载:https://files.cnblogs.com/files/xiandedanteng/AngularJSAuthorRepeat.rar
代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html ng-app="notesApp"> <head> <title> New Document </title> <style> .odd{ background-color:blue; width:300px; } .even{ background-color:yellow; width:300px; } </style> <meta charset="utf-8"> <script src="angular1.4.6.min.js"></script> </head> <body ng-controller="MainCtrl as ctrl"> <div ng-repeat="(author,member) in ctrl.members" ng-class="ctrl.getBackground(member.gender)"> {{member.id}}.name={{author}},age={{member.age}} <div> </body> </html> <script type="text/javascript"> <!-- angular.module('notesApp',[]) .controller('MainCtrl',[function(){ var self=this; self.members={ andy:{id:1,age:20,gender:'male'}, bill:{id:2,age:21,gender:'female'}, Cindy:{id:3,age:22,gender:'male'}, douglas:{id:4,age:23,gender:'female'}, Einstein:{id:5,age:24,gender:'male'}, }; self.getBackground=function(gender){ if(gender=='male'){ return 'odd'; }else{ return 'even'; } }; }]); //--> </script>
效果:
要点:
ng-repeat指令可以显示出一个对象所有的属性名和属性值。
AngularJS的ng-repeat显示属性名和属性值的更多相关文章
- Object 对象(对象的分类、属性(属性名和属性值)、基本数据类型与引用数据类型区别)
Object——引用数据类型 基本数据类型的不足之处:基本数据类型是单一的值,不能表现出值与值之间的所属关系 object分为内建对象.宿主对象和自定义对象 a 内建对象:ES标准中定义的对象,在任何 ...
- java中遍历实体类,获取属性名和属性值
方式一(实体类): //java中遍历实体类,获取属性名和属性值 public static void testReflect(Object model) throws Exception{ for ...
- java 反射机制--根据属性名获取属性值
1.考虑安全访问范围内的属性,没有权限访问到的属性不读取 /** * 根据属性名获取属性值 * * @param fieldName * @param object * @return */ priv ...
- C# 随机给一个全部信息都未知的类类型,如何获取该类的类名、属性个数、属性名、属性的数据类型、属性值?
一.场景假设 假设现在有一个泛型类T的实例对象t,该T类的全部信息都未知. 要求:打印输出实例对象t的类名.属性个数.属性名.属性的数据类型.属性值. 二.解决问题 1.我们根据输出的内容要求定义一个 ...
- .net 取得类的属性、方法、成员及通过属性名取得属性值
//自定义的类 model m = new model(); //取得类的Type实例 //Type t = typeof(model); //取得m的Type实例 Type t = m.GetTyp ...
- 第二章 Jackson属性名转换+属性忽略
@Data @JsonIgnoreProperties(ignoreUnknown = true) public class MyRecord { private boolean succeed; p ...
- .net 取得类的属性、方法、成员及通过属性名取得属性值
//自定义的类 model m = new model(); //取得类的Type实例 //Type t = typeof(model); //取得m的Type实例 Type t = m.G ...
- JavaScript属性名和属性值
㈠属性名 var obj = new Object(); 向对象中添加属性 ⑴属性名: - 对象的属性名不强制要求遵守标识符的规范 什么乱七八糟的名 ...
- JS基础_属性名和属性值
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- CI 分页类的使用
分页本身很简单,无非就是一个 [limit $offset, $length] 的过程. $length 是每页显示的数据量,这个是固定的.要确定的就只有 $offset了. 在CI中的分页类同样要依 ...
- python - 路径处理 和 模块导入
# -*- coding:utf-8 -*- '''@project: jiaxy@author: Jimmy@file: study_模块导入.py@ide: PyCharm Community E ...
- 【LeetCode】Reverse Integer(整数反转)
这道题是LeetCode里的第7道题. 题目描述: 给出一个 32 位的有符号整数,你需要将这个整数中每位上的数字进行反转. 示例 1: 输入: 123 输出: 321 示例 2: 输入: -123 ...
- 牛客网数据库SQL实战
查找最晚入职员工的所有信息 CREATE TABLE `employees` (`emp_no` int(11) NOT NULL,`birth_date` date NOT NULL,`first_ ...
- [python IO学习篇] 补充中文编码
http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/001386820066616a7 ...
- ZOJ-3956 Course Selection System,01背包!
Course Selection System 比赛的时候最后20分钟想到了是01背包,奈何没时间推出怎么背. 题意:n门课程,每门课程都有一个h值和c值,现在给出一个happy的定义,所选的课程的h ...
- Dropbox面向第三方开发者推出全新的Datastore API
Dropbox今天推出了全新的高级的同步API,开发者可以使用Dropbox的技术同步跨设备app的数据. Datastore API在现有的Dropbox Sync API基础上进行了扩展,允许开发 ...
- iOS--app自定义相册--创建相簿,存储图片到手机
我们在APP中点击照片,都会显示出大图,然后在大图的上面会有个保存照片的按钮,照片直接保存到了系统的相册中,但是因为公司产品的需要,让你创建和APP同名的相册保存在里面,那么就对了,可以看下具体的代码 ...
- java中文乱码问题解决
1 处理乱码方式: 1 连接数据库的时候 jdbc.properties:jdbc:mysql://localhost:3306/myproject?useUnicode=true&chara ...
- 【前端学习笔记】2015-09-02~~~~ 关于filter()匹配的使用
关于filter的使用先记录以下几点: 1.filter(':even')遍历所有元素,找到index为偶数的元素.. ps: filter(':odd') odd----奇数 eve ...