Всем привет, столкнулся со следующей проблемой. При реализации ангуляровской директивы ng-repeat код работает некорректно и проблема заключается в следующем: элементы рендерятся, но текст внутри них отсутствует. Собственно сам код.
.directive("myRepeat", function() {
return {
transclude: "element",
compile : function(tElem, tAttrs){
var myLoop = tAttrs.myRepeat,
match = myLoop.match(/^\s*(.+)+in\s+(.*?)\s*(\s+track\s+by\s+(.+)\s*)?$/),
indexString = match[1],
collectionString = match[2],
parent = tElem.parent();
return function($scope, iElem, iAttrs, controller, transclude) {
$scope.$watchCollection(collectionString, function(newCollection) {
var i, block, childScope, elements = [];
// check if elements have already been rendered
if (elements.length) {
// if so remove them from DOM, and destroy their scope
for (i = 0; i < elements.length; i++) {
elements[i].el.remove();
elements[i].scope.$destroy();
}
elements = [];
}
for (i = 0; i < newCollection.length; i++) {
transclude(function(clone, scope) {
scope[indexString] = newCollection[i];
parent.append(clone);
block = {};
block.el = clone;
block.scope = scope;
elements.push(block);
});
}
});
}
}
}
})
HTML код:
<ul ng-controller="MyCtrl">
<li my-repeat="city in cities">{{city.name}}</li>
</ul>
Буду очень благодарен, если кто-нибудь объяснит почему так происходит.
Средний
Средний
