如何监听angularjs列表数据是否渲染完毕_百度知道
如何监听angularjs列表数据是否渲染完毕
使用Jquery结合AngulraJs使用的时候，在render完table后，执行一段js脚本，把JqTable应用到该table上，能够捕获到AngularJs渲染完成页面的事件。要达到这个目的，需要为当前的app自定义directive:app.directive('onFinishRenderFilters', function ($timeout) {
restrict: 'A',
link: function(scope, element, attr) {
if (scope.$last === true) {
$timeout(function() {
scope.$emit('ngRepeatFinished');
};});然后，在需要监控的地方，加上该directive:&tr ng-repeat=&user in users& on-finish-render-filters&
&td&{{user.Id}}&/td&
&td&{{user.Name}}&/td&
&td&{{user.Salary}}&/td&&/tr&最后，补充上需要render完成之后的Js脚本:$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
//下面是在table render完成后执行的js
var table = $(&#leaderBoard&).dataTable({
bJQueryUI: true,
&sScrollX&: '100%',
其他类似问题
为您推荐：
提问者采纳
&&test&&is-over=&meta&ng-app=&&});&gt,
&&&&/ul&&;&=isOver'A'/html&&&src=&isOver'li&
};/div&:false
}:&&nbsp.$watch('&});{{item}}&&nbsp.utf-8&quot.log(&#39:&nbsp.now)
=&[0,function(){
return&&lt.$&$&&gt!'/li&&&nbsp:&nbsp,function(){
if($&&&/script&=&script&nbsp,&nbsp,
/script&;myApp&&angular,3;myAvar&myAangular,2;&nbsp.module(&items&&attr){
if(&&ng-repeat=&&&title&;function($scope){&nbsp.items&&/title&&gt.js&[]);div&
});ul&&&game&{
&&body&&&charset=&&{
'&&in&nbsp.$last){
scope:function(scope,1.toggle&&script&gt.=&nbsp,&&&/body&gt.over&&&&&myApp&&/head&testCtrl&&nbsp.directive('&;
}&testCtrl&&&&&nbsp.now&
$&&&nbsp,4],&item&nbsp.now'&&&);=&nbsp.controller(&ng-controller=&'&nbsp!doctype&&/div&div&myApp&&&nbsp,&;&html&head&&
$&gt&html&gt
监听的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁共被编辑 3 次
一个列表在渲染和绑定事件的时候，怎么处理好？//js对象
后端给我一个数组，每个数组对应图片上的一行数据，这样的列表怎么渲染和绑定事件(点击地图展现不同酒店的map)比较好？1.我一次性全部都渲染完毕拍在页面上，坐标信息放在 dom元素的attribute上。
//绑定点击地图事件
$("content").on("click","li",function(){
//show map
//通过 getAttribute()获得坐标信息。
2.每一行当作一个对象看待，渲染一行就new一个对象，坐标信息都放在对象实例中，然后append到页面中。
//绑定点击地图事件
$(",map").bind("click"function(){
//show map
//通过this 获得坐标信息
哪种效率比较高？
一个列表在渲染和绑定事件的时候，怎么处理好？//js对象
后端给我一个数组，每个数组对应图片上的一行数据，这样的列表怎么渲染和绑定事件(点击地图展现不同酒店的map)比较好？1.我一次性全部都渲染完毕拍在页面上，坐标信息放在 dom元素的attribute上。//绑定点击地图事件$("content").on("click","li",function(){
//show map
//通过 getAttribute()获得坐标信息。
2.每一行当作一个对象看待，渲染一行就new一个对象，坐标信息都放在对象实例中，然后append到页面中。//绑定点击地图事件$(",map").bind("click"function(){
//show map
//通过this 获得坐标信息
哪种效率比较高？
一个列表在渲染和绑定事件的时候，怎么处理好？//js对象
后端给我一个数组，每个数组对应图片上的一行数据，这样的列表怎么渲染和绑定事件(点击底图展现不同酒店的map)比较好？1.我一次性全部都渲染完毕拍在页面上，坐标信息放在 dom元素的attribute上。//绑定点击地图事件$("content").on("click","li",function(){
//show map
//通过 getAttribute()获得坐标信息。
2.每一行当作一个对象看待，渲染一行就new一个对象，坐标信息都放在对象实例中，然后append到页面中。//绑定点击地图事件$(",map").bind("click"function(){
//show map
//通过this 获得坐标信息
哪种效率比较高？
我要举报该，理由是：
扫扫下载 App
SegmentFault
一起探索更多未知&&&& 这是个小菜在实际工作中遇到的问题，相信很多EasyUI新手很可能也遇到这样的问题，因此小菜觉得有必要拿出来分享一下。
&&&& 这个问题要从EasyUI的datebox组件说起，小菜用这个组件的时候，发现用$("#id").val()这种形式，居然拿不到文本框的值！
&&&& 经过度娘的帮助，发现可以用$("#id").datebox('getValue')，但是这是为什么捏？
&&&& 经过一翻研究和探索，小菜发现，如果一个input加上class="easyui-datebox"，也就是声明在此文本框上边使用datebox组件，那么经过EasyUI引擎的扫描，会自动为此文本框加上各种样式，与此同时，EasyUI去掉了此文本框上的id和name属性！最后，它会在此文本框的附近，添加一个隐藏的文本框，这个文本框的name和原来文本框的name一样，id属性直接丢掉。。。。这个隐藏文本框的值，才是咱们看到的日期。如图：
&&&& 这下读者应该明白，为什么$("#id").val()拿不到值，因为原来文本框的id属性已经被拿掉，新创建的隐藏文本框也没有id属性，所以拿不到值，可以通过官方的给出的$("#id").datebox('getValue')弥补(具体人家怎么拿到的，小菜也不懂呀)。
&&&& 但是，这仅仅是用id选择器的情况，别忘了还有name，我们可以通过$("input[name='mydate']").val()这种方式获取文本框的值。
&&&& 因此，如果不想用$("#id").datebox('getValue')，那么就别加id，或者说别用id选择器，给文本框加一个name属性，很轻松的就拿到值了。
&&&& 另外，补充一下，如果用的标签选择器，也就是用的name属性，然后又用.datebox('getValue')去拿值，那么会报错哦。。。例如：$("input[name='mydate']").datebox('getValue')，会报TypeError: $.data(...) is undefined。
&&&& 说了这么多，貌似还没有进入正题，读者应该也能体会到，在某个input标签上添加class="easyui-datebox"，它就能自动变成日历，这其实是EasyUI扫描的结果，在网页加载完成后，相当于在$(document).ready()事件中，对整个网页进行了一次扫描，发现某个input标签含有class="easyui-datebox"属性，就做上边讲到那些处理，不仅仅是EasyUI如此，几乎所有的UI都是这个原理。
&&&& 因此，如果我们用什么append、appendTo方法动态在页面中插入一段html代码，或者用什么addClass方法给input标签动态添加一个class属性，这些操作EasyUI是不知道的，所以新插入的这些东东，即使有class="easyui-datebox"属性，但没有任何效果。
&&&& 如何通知EasyUI呢？通过查询资料，发现网上比较流行的一种方法是用：$.parser.parse()。一般像我这样的小菜可能就直接拿来用了，把它放在插入html的语句之后，重新渲染界面，果然很管用，新加入的元素能被识别。
&&&& 但是，小菜很快就发现一个问题，由于使用了$.parser.parse()对整个页面重新渲染，这会影响到以前已经渲染过的组件。
&&&& 举个例子：页面原本有一个使用了datebox组件的input标签，用户通过datebox组件选择了时间，然后用户又新增了一个使用datebox组件的input标签(这时候程序会重新渲染页面)，奇怪的事情发生了：原来的input标签明明已经选过时间，显示的也正常，但却拿不到值！
&&&& 根据小菜的想法，原因正是出在$.parser.parse()上，由于它对整个页面进行渲染，以前正常的组件也被渲染了，相当于所有的组件进行了一次&初始化&，最终导致值丢失。
&&&& 再仔细问问度娘，发现$.parser.parse()是可以带参数的，参数意思差不多就是传入一个局部的DOM对象，只对局部进行渲染，避免影响其他组件。
&&&& 举个巧妙的应用例子：
&&&& var targetObj = $("&input name='mydate' class='easyui-datebox'&").appendTo("#id");
&&&& $.parser.parse(targetObj);
&&&& 我们常常会通过appendTo方法把使用了datebox组件的input标签插入到某个DOM中，别忘了appendTo方法是有返回值的，返回的恰恰就是刚刚插入的对象。我们拿到这个对象，单独对它进行渲染，这样既可以实现动态渲染，又能避免影响其它组件。
&&&& 因此，在读者的项目中，最好使用局部渲染(无论用何种方法得到目标对象)，避免使用全局渲染。
&&&& 好啦，小菜的教程就写到这，希望对大家有所帮助，高手勿喷~
阅读(...) 评论()Nodejs + React做后端渲染时，如何绑定事件 - 提问 - React 中文
11:19:55 UTC
以下是React实现的后端组件（click-demo.js），我希望在后端渲染的时候直接绑定onClick事件，避免在前端再次操作，代码如下
var React = require("react/addons");
var ClickItem = React.createClass({
onClick : function(){
console.log("Item clicked ~");
: function(){
&div onClick={this.onClick}&点击这里输出console信息！&/div&
module.exports = ClickI
在路由器中，我通过React.createFactory以及renderToString将组件转化为字符串并渲染到页面中去，如下：
= require("react/addons");
var ClickDemo
= React.createFactory(require("../components/click-demo"));
exports.index = function(req, res){
var demo = React.renderToString(ClickDemo());
res.render("index/index", { demo : demo });
页面上直接通过如下方式在输出内容：
&%- demo %&
但是，问题是，在组件中绑定的***onClick事件并没有生效***：
&div onClick={this.onClick}&点击这里输出console信息！&/div&
是绑定的方式不对，还是本来就不支持这种事件绑定方式，望各位大神指点～
11:21:34 UTC
后端是不能做绑定的. 前端才能做绑定.
浙ICP备号-3}