Я хочу создать список с пользовательским поведением, когда оносодержание меняется. Я пытаюсь создать директиву для этого, но я немного теряюсь из-за того, как объединить ng-transclude с директивой ng-repeat. Может кто-нибудь поставить меня на путь?

Html:

  
    
       <span class="etc">{{myItem}}</span>
    
  

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: [
      '',
        '',
      ''
    ].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; 
      });      
    }
  }
});

у меня есть часть этого несколько работающегоВот

РЕДАКТИРОВАТЬ:

Критерии:

Шаблон элемента должен быть определен в представлении, а не в директиве, и он должен иметь доступ к свойству элемента в дочерней области. В идеале я хочу определить это так, как это делается в директиве ng-repeatДиректива должна иметь доступ к списку, чтобы я мог установить правильные часы и изменить вещи. Если возможно, я хотел бы иметь легкий доступ к сгенерированным элементам DOM (я также могу сделать это сelement[0].querySelectorAll('ul>li') или что-то, это должно работать только на Chrome).Если возможно, я бы хотел повторно использовать логику в директиве ng-repeat, потому что она уже делает многое из того, что я хочу. Предпочтительно я неЯ не хочу копировать код. Я просто хочу улучшить его поведение, а не изменить его