ng-reapte指令遍历

如果想知道当前遍历的下标,也就是数据源中的第几个,可以用$index
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<style media="screen">
.container{
width: 100%;
height: 100%;
}
.container img{
width: 150px;
height: 100px;
}
span{
display: block;
width: 100%;
height: 100px;
}
</style> <script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></script> </head>
<body>
<div data-ng-app="" data-ng-init="names=[
{
url:'./1.jpg'
},
{
url:'./1.jpg'
}
,
{
url:'./1.jpg'
}
,
{
url:'./1.jpg'
}
,
{
url:'./1.jpg'
}]"
>
<span></span>
<img data-ng-repeat="x in names" ng-src={{x.url}} alt="">
</div>
</ul>
</body>
</html>
ng-reapte指令遍历的更多相关文章
- Angular CLI ng常用指令整理
一.组件创建 ng generate component heroes 二.运行项目 ng serve --open //--open 立即打开 三.创建指令 ng g directive my-ne ...
- [译]ng指令中的compile与link函数解析 转
通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. 原文地址 angularjs里的指令非常神 ...
- ng-repeat指令中使用track by子语句解决重复数据遍历的错误
用ng-repeat指令遍历一个javascript数组,当数组中有重复元素的时候,angularjs会报错,这是因为ng-Repeat不允许collection中存在两个相同Id的对象. 对于数字或 ...
- ng 指令的自定义、使用
1.创建和使用var app = angular.module('myApp',['ng']);app.directive('指令名称',func); 自定义指令的命名:驼峰式,有两部分构成,前缀一般 ...
- 走进AngularJs(五)自定义指令----(下)
自定义指令学习有段时间了,学了些纸上谈兵的东西,还没有真正的写个指令出来呢...所以,随着学习的接近尾声,本篇除了介绍剩余的几个参数外,还将动手结合使用各参数,写个真正能用的指令出来玩玩. 我们在自定 ...
- angularjs指令中的compile与link函数详解(转)
http://www.jb51.net/article/58229.htm 通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link, ...
- 【转】angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
- angular指令(二)--内置指令
一.基础ng 属性指令: ng-href ng-src ng-disabled ng-checked ng-readonly ng-selected ng-class ng-styl ...
- 走进AngularJs(四)自定义指令----(中)
上一篇简单介绍了自定义一个指令的几个简单参数,restrict.template.templateUrl.replace.transclude,这几个理解起来相对容易很多,因为它们只涉及到了表现,而没 ...
随机推荐
- C学习笔记-结构体
结构体的定义和初始化 结构体是简单数据类型的综合 struct man { char name[100]; int age; }; struct man m = { "tom", ...
- 浅谈Web图像优化
前端优化有很多,图像优化也是其中的一部分.无论是渐进增强还是优雅降级,图像优化成为了开发上不可忽视的一部分. 知其然,须知其所以然 图像优化的前提是需要了解图像的基本原理.常规的图像格式分为矢量图和位 ...
- 菜鸟系列Fabric——Fabric 1.2 单机部署(2)
Fabric 1.2单机部署 https://hyperledger-fabric.readthedocs.io/en/release-1.2/whatis.html 创建目录 sudo mkdir ...
- __VA_ARGS__用法
转载 自定义调试信息的输出 调试信息的输出方法有很多种, 例如直接用printf, 或者出错时使用perror, fprintf等将信息直接打印到终端上, 在Qt上面一般使用qDebug,而守护进 ...
- Eclipse中导入Maven Web项目并配置其在Tomcat中运行
今天因为实习的关系需要讲公司已经开发的项目导入进Eclipse,而公司的项目是用Maven来构建的所以,需要将Maven项目导入进Eclipse下. 自己因为没有什么经验所以搞了得两个多小时,在这里和 ...
- 初步了解autoencoder
初步了解autoencoder 学习自莫烦python 什么是autoencoder? 自编码(autoencoder)是一种神经网络的形式. 例子:一张图片->对其进行打码->最后再将其 ...
- linux 三剑客之awk总结
AWK 1.begin end使用 cat /tmp/passwd |awk -F ':' 'BEGIN {print "hello"} {print $1"\t&quo ...
- RPC 框架 介绍 (转)
出处: 谁能用通俗的语言解释一下什么是 RPC 框架? 知乎: 问题:了解到最近 Java 的 Netty 很火,只知道它是这样类型的一种框架.想了解一下它主要用于解决了什么问题?适用于什么样的场景? ...
- Windows Runtime (RT)
学了sl for wp 开发了1年都没入门,只能说自己的学习欲望太低了. 今天偶然才发现wrt 跟 .net 是2个东西... orz. 得抛弃 sl ,wrt才是未来的主流吧... 这篇文章不错 h ...
- @Transactional spring事务回滚相关
还可以设置回滚点,看下面 /** * 用户登录接口 * * * 1明确事务方法前的命名规则 * 2保证事务方法执行的时间尽可能的短,不允许出现循环操作,不允许出现RPC等网络请求操作 * 3不允许所有 ...