Quiero crear una lista con comportamiento personalizado cuando se modifica el contenido. Intento crear una directiva para esto, pero me pierdo un poco con la forma de combinar ng-transclude con la directiva ng-repeat. ¿Alguien me puede poner en el camino?

HTML:

<div ng-app="myApp">
  <div ng-controller="ctrl">
    <mylist items="myItem in items">
       <span class="etc">{{myItem}}</span>
    </mylist>
  </div>
</div>

Javascript:

angular.module('myApp', [])    

.controller('ctrl', function ($scope) {
  $scope.items = ['one', 'two', 'three'];
})    

.directive('mylist', function () {
  return {
    restrict:'E',
    transclude: 'element',
    replace: true,
    scope: true,
    template: [
      '<ul>',
        '<li ng-repeat="WhatGoesHere in items" ng-transclude></li>',
      '</ul>'
    ].join(''),
    link: function (scope, element, attr) {
      var parts = attr.items.split(' in ');
      var itemPart = parts[0];
      var itemsPart = parts[1];
      scope.$watch(itemsPart, function (value) {
        scope.items = value; 
      });      
    }
  }
});

Tengo parte de esto trabajando un pocoaquí

EDITAR:

Criterios:

La plantilla del elemento debe definirse en la vista, no en la directiva y debe tener acceso a una propiedad del elemento en un ámbito secundario. Idealmente, quiero definir esto como se hace en la directiva ng-repeatLa directiva debe tener acceso a la lista para que pueda configurar los relojes adecuados y cambiar las cosas. Si es posible, me gustaría tener un acceso fácil a los elementos DOM generados (también puedo hacerlo conelement[0].querySelectorAll('ul>li') O algo así, solo tiene que funcionar en Chrome).Si es posible, me gustaría reutilizar la lógica en la directiva ng-repeat porque ya hace mucho de lo que quiero. Preferiblemente no quiero copiar el código. Solo quiero aumentar su comportamiento, no cambiarlo.