Eu quero criar uma lista com comportamento personalizado quando o conteúdo é alterado. Eu tento criar uma diretiva para isso, mas me perco um pouco com a maneira de combinar o ng-transclude com a diretiva ng-repeat. Alguém pode me colocar no caminho certo?

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; 
      });      
    }
  }
});

Eu tenho parte disso funcionandoAqui

EDITAR:

Critério:

O modelo do item deve ser definido na exibição, não na diretiva e deve ter acesso a uma propriedade de item em um escopo filho. Idealmente eu quero definir isso como é feito na diretiva ng-repeatA diretiva deve ter acesso à lista para que eu possa definir os relógios adequados e alterar as coisas. Se possível, gostaria de ter acesso fácil aos itens DOM gerados (eu também posso fazer isso comelement[0].querySelectorAll('ul>li') ou algo assim, só tem que funcionar no Chrome).Se possível, eu gostaria de reutilizar a lógica na diretiva ng-repeat porque ela já faz muito do que eu quero. De preferência, não quero copiar o código. Eu só quero aumentar seu comportamento, não mudá-lo