NG-重复与对象不成长 [英] ng-repeat not growing with object
问题描述
我这样做：
＆LT;身体GT;
＆LT; DIV NG控制器=presentationCtrl＆GT;
＆LT; A HREF =NG点击=的findAll（）＆GT;查找和LT; / A＆GT;
＆LT; DIV＆GT;
＆LT; UL类=无样式＆GT;
＆LT;李NG重复=p在presentations＆GT;
＆所述; IMG纳克-SRC ={{P}}ALT =presentation＆GT;
＆LT; /李＆GT;
＆LT; / UL＆GT;
＆LT; DIV＆GT;
＆LT; / DIV＆GT;
＆LT; /身体GT;
我有一个占位符元素 presentations 内部时设置功能 presentationCtrl 被击中。
在该的findAll 链接被击中，我一个元素添加到像数组这样： $范围presentations.push（SURL ）;
不过，看我的页面时，列表不会增长。
确实 NG-重复只火一次，还是什么？我可以强制刷新，并显示 presentations ？
下面是我的控制器
的的console.log 我把之前的元素放入数组被击中。并显示我期望中的字符串。
函数presentationCtrl（$范围）{
$范围presentations =http://angularjs.org/img/AngularJS-small.png]。$ scope.findAll =功能（）{
VAR插座= NULL;
插座= io.connect（的http：// [服务器]：3000）;
socket.on（握手，函数（）{
socket.emit（'viewAll'，{房客：QA'}）;
socket.on（'returnAll'，功能（回）{
对于（i = 0; I＆LT; back.length;我++）{
为（J = 0; J＆lt;返回[I] .slides.length; J ++）{
socket.emit（'signUrl'，（回[I] .slides [J] .location））;
打破;
}
}
socket.on（'signedUrls'，函数（SURL）{
的console.log（从signedUrls回来+ SURL）;
。$范围presentations.push（SURL）;
}）;
}）;
}）;
};
}
它工作正常。
http://plnkr.co/edit/agadSBFgz8YhWuDTtCPx?p=$p$ PVIEW
您的情况可能有所不同。
--------- ---------编辑
好吧，我得到了你的情况。你是不是在AngularJS的手表运行的功能。
因此，AngularJS不知道你的变量发生改变，基本上$摘要不叫。
要模仿原生的JavaScript异步调用，我使用的setTimeout。
以下code 不的工作。它改变数值，但它不会被关注。
的setTimeout（函数（）{
$范围presentations = [6,7,8,9]。
}，1000）;
然而，这code 确实的工作。它改变数值如预期
$超时（函数（）{
$范围presentations = [6,7,8,9]。
}，1000）;
setTimeout和$超时之间的区别在于，$超时下AngularJS的手表运行。
因此，要使它工作，你需要一个函数运行 $ scope.apply（）后，或在它。
这code 确实的工作的setTimeout 。
的setTimeout（函数（）{
$范围presentations = [6,7,8,9]。
$ $范围适用于（）。
}，1000）;
不能全部解释给你详细描述，因为我真的不掌握了AngularJS code。
该博客有我们为什么需要运行$应用一个很好的解释。
http://jimhoskins.com/2012/12/17/ angularjs和-apply.html
只是冰山，很快得到了答案，最好是在有或的jsfiddle plunkr一个简单的例子。结果
我知道$ HTTP调用不能plunkr或进行的jsfiddle全世界展示，但你可以通过模仿你的情况的setTimeout 。它可以使你的情况可以理解的大部分时间的读者。
I'm doing this:
<body>
<div ng-controller="PresentationCtrl">
<a href="" ng-click="findAll()">Find</a>
<div>
<ul class ="unstyled">
<li ng-repeat="p in presentations">
<img ng-src="{{p}}" alt="presentation">
</li>
</ul>
<div>
</div>
</body>
I have one placeholder element inside of presentations that is set when the function PresentationCtrl is hit.
When the findAll link is hit, I add an element to the array like so: $scope.presentations.push(sUrl);
But, when viewing my page, the list doesn't grow.
Does ng-repeat only fire once, or something? Can I force it to "refresh" and display the current values in presentations?
Here's my controller
The console.log before I push the element into the array gets hit. and displays the string that I expect.
function PresentationCtrl($scope){
$scope.presentations = ["http://angularjs.org/img/AngularJS-small.png"];
$scope.findAll = function(){
var socket=null;
socket = io.connect('http://[server]:3000');
socket.on('handshake',function(){
socket.emit('viewAll',{tenant:'qa'});
socket.on('returnAll',function(back){
for(i=0;i<back.length;i++){
for(j=0;j<back[i].slides.length;j++){
socket.emit('signUrl',(back[i].slides[j].location));
break;
}
}
socket.on('signedUrls',function(sUrl){
console.log("back from signedUrls" + sUrl);
$scope.presentations.push(sUrl);
});
});
});
};
}
it works fine.
http://plnkr.co/edit/agadSBFgz8YhWuDTtCPx?p=preview
Your situation might be different.
--------- EDIT ---------
ok, I got your situation. You are running a function not under watch of AngularJS. Thus, AngularJS does not know that your variable is changed, basically $digest is not called.
To mimic native Javascript asynchronous call, I use setTimeout.
The following code does not work. It change the value, but it won't be watched.
setTimeout( function() {
$scope.presentations = [6,7,8,9];
}, 1000);
However this code does work. It change the value as expected
$timeout( function() {
$scope.presentations = [6,7,8,9];
}, 1000);
The difference between setTimeout and $timeout is that $timeout is running under watch of AngularJS.
Thus to make it work, you need to run $scope.apply() after it, or within it as a function.
This code does work with setTimeout.
setTimeout( function() {
$scope.presentations = [6,7,8,9];
$scope.$apply();
}, 1000);
Can't explain all to you in detail because I don't really mastered the AngularJS code.
This blog has a very good explanation about why we need to run $apply.
http://jimhoskins.com/2012/12/17/angularjs-and-apply.html
Just for the tip, to get the answer quickly, it's better to have a simplified example in jsfiddle or plunkr.
I know $http call cannot be demoed in plunkr or jsfiddle, but you can mimic your situation using setTimeout. It can make your situation understandable to readers most of time.
这篇关于NG-重复与对象不成长的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
