Angular's implementation of the ng-repeat directive. What's wrong?

Question

Angular

Hello everyone, I've run into the following problem. When implementing the Angular ng-repeat directive, the code does not work correctly and the problem is as follows: the elements are rendered, but there is no text inside them. Actually the code itself.

.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 code:

<ul ng-controller="MyCtrl">
  <li my-repeat="city in cities">{{city.name}}</li>
</ul>

I would be very grateful if someone could explain why this is happening.

Answer 1

There have been changes in the angular c transclude function. This one works: liamkaufman.com/blog/2013/05/13/understanding-angu...