angularjs - ngRepeat与ngInit - ngRepeat不刷新值呈现 [英] angularjs - ngRepeat with ngInit - ngRepeat doesn't refresh rendered value
问题描述
我这是使用ngRepeater但这个指令我使用的执行功能，它应该返回要显示的对象ngInit指令显示阵列。一切完美的作品，但是当我添加了新建按钮，在这里我想补充新的价值数组，那么功能设置preVIEW只有一次，我认为函数应该从数组值的量根据被执行被执行。我该怎么办呢？
I have array which is displayed using ngRepeater but with this directive I'm using ngInit directive which execute function which should return object to be displayed. Everything works perfectly but when I added "New" button where I add new value to array then function "SetPreview" is executed only once I think function should be executed depending from the amount of array value. How can I do that?
用户界面：
<body ng-app>
<ul ng-controller="PhoneListCtrl">
<button ng-click="add()">Add</button>
<li ng-repeat="phone in phones" ng-init="displayedQuestion=SetPreview(phone);">
{{displayedQuestion.name}}
<p>{{displayedQuestion.snippet}}</p>
</li>
</ul>
</body>
控制器：
function PhoneListCtrl($scope) {
$scope.phones = [
{"name": "Nexus S",
"snippet": "Fast just got faster with Nexus S."},
{"name": "Motorola XOOM™ with Wi-Fi",
"snippet": "The Next, Next Generation tablet."},
{"name": "MOTOROLA XOOM™",
"snippet": "The Next, Next Generation tablet."}
];
$scope.add = function(){
this.phones.push({name:'1', snippet:'n'});
};
$scope.SetPreview = function(phone)
{
//here logic which can take object from diffrent location
console.log(phone);
return phone;
};
}
编辑：
这里比较复杂的样品： - >现在手机的集合为空，当您单击添加按钮添加新的项目，被设置为可编辑（您可以更改文本字段值），并执行ngRender当设置preVIEW函数返回可编辑的对象（如preVIEW它的工作）。现在，尝试再次单击Add按钮，你可以看到第一个项目的可编辑值仍然是presented用户，但我想刷新整个NG-中继器。
Here is more complicated sample: -> Now collection of Phones is empty, when you click Add button new item is added and is set as editable(you can change value in text field) and when ngRender is executed SetPreview function returns editable object(it’s work like preview). Now try click Add button again and as you can see the editable value of first item is still presented to user, but I want to refresh entire ng-repeater.
推荐答案
您正在运行到角性能的功能。
You are running into an Angular performance feature.
实质上角可以看到阵列（A为例）中的元素是相同的对象的参考，因此它不会纳克-INIT再次调用。这是有效的。即使你串接一个老列表成为一个新列表，角度会看到它，它相同的参考。
Essentially Angular can see that the element in the array ('A' for example) is the same object reference, so it doesn't call ng-init again. This is efficient. Even if you concatenated an old list into a new list, Angular would see that it it the same reference.
如果相反，你创建一个新的对象，因为旧的对象相同的值，它有不同的参考和角度重新inits吧：
坏榜样，做你在找什么： http://jsfiddle.net/fqnKt/37/
If instead you create a new object with the same values as the old object, it has a different reference and Angular re-inits it: Bad example that does what you are looking for: http://jsfiddle.net/fqnKt/37/
$scope.add = function(item) {
var newItems = [];
angular.forEach($scope.items, function(obj){
this.push({val:obj.val});
},newItems)
newItems.push({val:item})
$scope.items = newItems;
};
我不建议在拨弄采取的做法，而是你应该找一个不同的方法NG-INIT触发您的code。
I don't recommend the approach taken in the fiddle, but rather you should find a different method that ng-init to trigger your code.
这篇关于angularjs - ngRepeat与ngInit - ngRepeat不刷新值呈现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
