怎么在ng-repeat生成的元素上操作dom
这个问题其实对初学者来说,都 有这样的经历,用ng-repeat生成的元素用js怎么也获取不到;这个其中原由是:angular拥有自动化渲染DOM的特性,它能帮助我们专注于操作数据,而页面的渲染则由angular自身来完成。这就造成了 ng-repeat 循环完成后angular并不会告诉我们dom渲染完了;换句话说就是不知道angular渲染dom何时完成(得不到生成的元素是因为这个元素还没有渲染出来)。
也就是说要找一个方法使你知道什么时候angular渲染dom完成了,你再才来操作dom,得到你想要的元素、进行操作。。。。
<div ng-repeat="item in items" on-finish>
<div>{{item.name}}}<div>
</div>
//js
var module = angular.module('fang', [])
.directive('onFinish', function ($timeout) {
return {
restrict: 'A',
link: function (scope, element, attr) {
if (scope.$last === true) {
$timeout(function () {
scope.$emit('ngRepeatFinished');
});
}
}
}});
$scope.$on('ngRepeatFinished', function(ngRepeatFinishedEvent) {
//这里写获取dom的操作,
});
这样你就可以用js找到ng-repeat生成的元素了;并进行相关元素操作。
怎么在ng-repeat生成的元素上操作dom的更多相关文章
- 给DOM生成的元素添加事件
问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...
- JS动态生成的元素,其对应的方法不响应(比如单击事件,鼠标移动事件等)
主要原因:在页面给元素注册点击事件的时候[ $(function () { XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...
- jQuery 绑定事件到动态创建的元素上
在进入主题之前,我们先来看一个前台页面经常用到的功能:点击页面输入框时自动选择其中文本. 很容易想到利用输入框的focus事件,当输入框获得焦点时,再调用jQuery的select()方法. Okay ...
- 2)JS动态生成HTML元素的爬取
2)JS动态生成HTML元素的爬取 import java.util.List; import org.openqa.selenium.By; import org.openqa.selenium.W ...
- jQuery对于动态生成的元素绑定无效的问题~~
问题:很多时候发现,对动态生成的元素绑定click事件是无效的- 原因:直接绑定到动态生成的元素是无效的,是因为Jquery扫描文档找出所有的$(‘’)元素,并把函数绑定到每个元素的click事件上, ...
- Angular如何给动态生成的元素绑定事件
在AngularJS中,操作DOM一般在指令中完成,事件监听机制是在对于已经静态生成的dom绑定事件,而如果在指令中动态生成了DOM节点,动态生成的节点不会被JS事件监听. 举例来说: angular ...
- 给DOM操作生成的元素添加事件
问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...
- jquery给动态生成的元素绑定事件,on函数
首先先解释一下什么是动态生成的元素:动态生成的元素即我们用jquery的内部插入函数append()所生成的html代码.相对的也有静态生成的元素:即直接编写在页面的html代码. 下面通过例子来讲解 ...
- AngularJS之一个元素上绑定多个指令作用域
前言 众所周知,我们在自定义指令时,会指定它的作用域,即scope设置项(默认值为false). 且,scope设置项,可以有三种值,从而也就代表三种不同的作用域,下面我们再来一起回顾下: 指令之sc ...
随机推荐
- 反向代理-- WEB服务的加速器[转]
昨天j.L问我http cache怎么设置,当时脑子有点糊涂,一时没想到其实他问的就是反向代理如何设置. 首发:PHP CUP xiaobao 什么是反向代理?反 向代理就是代理服务器(如ISA.Sq ...
- MySQL关联查询总结
MySQL中经常使用关联查询,有机会总结下: 1 left join(左联查询): 返回包括左表中的所有记录和右表中联接字段相等的记录 例:select * from a left join b on ...
- 使用EntityFramework持久化聚合
目录 背景使用EntityFramework持久化聚合备注 背景返回目录 DDD中只有聚合根可以有仓储,仓储负责整个聚合持久化的相关生命周期,在不使用工作单元或POCO的情况下,我们可以让Order内 ...
- 用TableView做的新闻客户端展示页面
用TableView做的新闻客户端展示页面 // MyTableViewImageCell.m // SildToDo // // Created by WildCat on 13-8-18. ...
- Web开发框架对比
Web开发框架能极大地提升开发效率,下面对一些常用的框作一些更深层次的对比. JSF JSF不是极好的快速开发原型,代码生成不是内置功能,并且原型开发应用需要开发完整应用程序那么多的配置.这真的不是J ...
- 基于支持向量机的车牌识别-- opencv2.4.7+vs2012环境搭建
环境说明: 环境: OS:win7 sp1 opencv:2.4.7 vs2012 搭建过程: PS:机器上原本已安装vs2012 1.opencv 1.1 下载,直接双击安装即可. 此处我的安装位置 ...
- Arduino 串口篇 Arduino发送二进制 send binary via RS232-to-USB to PC
有用的链接在这里:http://hi.baidu.com/mizuda/item/06b7fdc1d0e45a0ec710b2dd 更加详细的内容请查阅Arduino官方:http://arduino ...
- [重构到模式-Chain of Responsibility Pattern]把Fizz Buzz招式重构到责任链模式
写一段程序从1打印到100,但是遇到3的倍数时打印Fizz,遇到5的倍数时打印Buzz,遇到即是3的倍数同时也是5的倍数时打印FizzBuzz.例如: 1 2 Fizz 4 Buzz Fizz 7 8 ...
- 在 Linux 中自动生成 Cordova/Phonegap for Android 的 APK 安装程序
在 Linux 中自动生成 Cordova/Phonegap for Android 的 APK 安装程序 本贴首发于: http://xuekaiyuan.com/forum.php?mod=vie ...
- 墙上时钟时间 ,用户cpu时间 ,系统cpu时间
一. 墙上时钟时间 ,用户cpu时间 ,系统cpu时间定义与联系 时钟时间(墙上时钟时间wall clock time):从进程从开始运行到结束,时钟走过的时间,这其中包含了进程在阻塞和等待状态的时间 ...