AngularJSのng-repeatのループ終了後にfunctionを走らせる方法

外部ライブラリ等ではhtmlタグを作った後にfunctionをアプライするときがあります。 例えば、テーブルを作成後にテーブル整形するJQuery functionを適用する場合です。 AngularJSでは、ng-repeat終了のイベントは存在しないのでDirectiveを使うことになります。

どうやるかは下記のようにディレクティブを作り、

// directives/main.js
angular.module('myApp')
.directive('myRepeatDirective', function() {
    return function(scope, element, attrs) {
        angular.element(element).css('color','blue');
        if (scope.$last){
            $('.tl1').timeline();
        }
    };
});

でviewでmy-repeat-directiveを呼び出す。

     <div class="item" data-id="{{pic.datetime}}" data-description="abc" ng-repeat="pic in pics" ng-model="pics" my-repeat-directive>
        <a class="image_rollover_bottom con_borderImage" data-description="ZOOM IN" href="" rel="lightbox[timeline]">
          <img src="{{ pic.photo }}" alt=""/>
        </a>
        <h2>{{ pic.datetime }}</h2>
        <span>{{pic.comment}}</span>
      </div>

参考

• http://stackoverflow.com/questions/13471129/angularjs-ng-repeat-finish-event

追記：May 2, 2014

上記で駄目でした。どこが駄目だったかというとdiv要素のdata-idやdata-descriptionはscope.$last時点ではまだ展開されていない。この要素を使うtimeline()ではうまく表示されない部分が出ました。３、４時間調べてもよくわからなかったので、おとなしく生のJSで、document.createElementしました。ふー。