AngularJS：链接到使用ng-repeat的指令中的元素

Question

我有一个简单的指令，其中模板在其中使用ng-repeat。我需要运行一些代码来针对ng-
repeat指令创建的某些元素实例化jquery组件。问题是，如果我将此代码放在链接函数中。ng-repeat尚未构建这些元素，因此未实例化任何内容。

App.directive('myDirective', ['$compile', '$timeout', function($compile, $timeout) {
  return {
    scope: {
        domains: '='
    },
    templateUrl: '/app/partials/my_directive.html',
    link: function($scope, element, attributes) {
        element.find('.standard-help').tooltip('destroy');
        element.find('.standard-help').tooltip({placement: 'top', trigger: 'click hover focus'});
    }
  };
}

该模板如下所示。我正在尝试附加

<ul class="media-list domainList">
  <li class="media" style="position:relative;" ng-repeat="domain in domains">
    <a class="domainHeader" href="javascript://">
        <span class="domainHeader">{{domain.tag}}</span>
    </a>
    <div class="media-body" style="margin-left: 52px;">
        <ul class="standardsList">
            <li ng-class="{ standardDisplayed: lessonLayout == 'standards' }" ng-hide="standard.lessons.length == 0" ng-repeat="standard in domain.standards">
                <a href="javascript://" title="{{standard.description}}" ng-show="lessonLayout == 'standards'" class="standard-help pull-right"><i class="icon-question-sign"></i></a>
                <h6 ng-show="lessonLayout == 'standards'">{{standard.tag}}</h6>
                <ul class="lessonsList">
                    <li ng-class="{ lesson: true }" ng-repeat="lesson in standard.lessons" ng-click="onLessonSelected(lesson)">
                        <i class="icon-lock lesson-locked"></i>
                        <div>{{lesson.title}}</div>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
  </li>
</ul>

我尝试使用$ watch（）和$
observe（）在域更改时注册回调，然后实例化工具提示代码。但是，我似乎无法在适当的时间给我打电话。有什么想法我想念的吗？

Answer 1

我发现，如果创建了我添加到正在创建ng-repeat的元素的另一个指令，则会针对创建的每个元素通知它。然后，我可以简单地$
emit一个事件，其父指令可以监听。在这一点上，它可以执行到那里重复元素的链接。这尤其适用于dom中的多个ng-
repeat，因为我可以按事件类型将它们分开，然后将事件类型传递给新指令。

这是我的指令：

App.directive("onRepeatDone", function() {
    return {
        restrict: 'A',
        link: function($scope, element, attributes ) {
            $scope.$emit(attributes["onRepeatDone"] || "repeat_done", element);
        }
    }
});

这是模板中该新指令的用法：

<ul>
    <li on-repeat-done="domain_done" ng-repeat="domain in domains">...</li>
</ul>

然后在父指令中，我可以执行以下操作：

link: function( $scope, element, attributes ) {
    $scope.$on('domain_done', function( domainElement ) {
        domainElement.find('.someElementInsideARepeatedElement').click(...);
    } );
}