Может ли кто-нибудь объяснить причину такого поведения?

Если директива с изолированной областьюscope: {} имеет корневой элемент сng-repeat А ТАКЖЕreplace: true затем он «ломает» область изолята, то есть область изолята не доступна / не видна внутри директивы, и директива начинает получать переменные из внешней области.

Вот минимально воспроизводимый пример, который я мог бы сделать:

app.controller('MainCtrl', function($scope) {
  $scope.name = 'MainCtrl';
});

app.directive("foo", function(){
  return {
    replace: true,
    scope: {},
    template: "<div ng-repeat='item in [1]'>{{name}}</div>",
    controller: function($scope){
      $scope.name = "foo";
    }
  };
});

Следующее представление будет отображать «MainCtrl»:

<div ng-controller="MainCtrl">
   <foo></foo>
</div>

Добавление либо неng-repeat-Возможен корень для шаблона или настройкиreplace: false отображает ожидаемый результат "foo".

Plunker