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,这几个理解起来相对容易很多,因为它们只涉及到了表现,而没 ...
随机推荐
- ASP.NET Core EFCore 之DBFirst 自动创建实体类和数据库上下文
通过引用Nuget包添加实体类 运行 Install-Package Microsoft.EntityFrameworkCore.SqlServer 运行 Install-Package Micros ...
- 菜鸟系列Fabric——Fabric 基本概念(1)
Fabric 基本概念 1.区块链介绍 区块链之所以引来关注是因为比特币开源项目,尤其是比特币价值的飙升,让大家开始关注数字货币以及相关技术.那么区块链究竟是什么? 1.1 区块链定义 狭义上,区块链 ...
- python 爬虫小案例
爬取百度贴吧帖子信息 #!/usr/bin/env python # -*- coding: utf-8 -*- # author: imcati import requests,re,time cl ...
- 【转帖】超能课堂(186) CPU中的那些指令集都有什么用?
超能课堂(186)CPU中的那些指令集都有什么用? https://www.expreview.com/68615.html 不明觉厉 开始的地方 第一大类:基础运算类x86.x86-64及EM64T ...
- Vue的快速入门
1 环境准备 1 下载安装Node 地址https://nodejs.org/en/download/ 完成后通过cmd打开控制台输入node -v 可以看到版本信息 2 通过该node自带的npm ...
- 最长相同01数的子串(map搞搞)--牛客第三场 -- Crazy Binary String
题意: 如题. 或者用我的数组分治也可以,就是有点愚蠢. //#include <bits/stdc++.h> #include <map> #include <iost ...
- Web前端开发中的小错误
Web前端开发中的小错误 错误1:表单的label标签跟表单字段没有关联 利用“for”属性允许用户单击label也可以选中表单中的内容.这可以扩大复选框和单选框的点击区域,非常实用. 错误2:log ...
- 客户端相关知识学习(三)之Android原生与H5交互的实现
Android原生与H5交互的实现 H5调用原生的方式 方式可能有多种,根据开发经验,接触过两种方式. 方法一:Android向H5注入全局js对象,也就是H5调Android 1.首先对WebVie ...
- workerman 实践 及 不能多人连接的问题
官网:https://www.workerman.net/ 手册地址:https://www.workerman.net/doc 追加内容: 请在开发前多读读 开发必读http://doc.worke ...
- 精通shell编程--最后的总结
不得不说shell语法是丑陋的,操作是简单高效的,最后一次学习总结shell shell总结 字符串删除与替换等常见操作 ## 字符串长度 a=1234 echo "${#a}" ...