Question

I have directive with this template that includes a repeater:

template:   '<div class="btn-group">' +
                    '<a href="javascript:void(0)" class="btn" ng-repeat="option in options" ng-click="select($event, scope)" value="{{option.value}}">{{option.label}}</a>' +
                '</div>'

Inside my link function, the following returns an empty array unless I put it inside a $timeout:

var tmp = element.find('.btn');

Link to fiddle: http://jsfiddle.net/dkrotts/XF3RY/1/

Shouldn’t these elements be available at link time? If not, is there a cleaner way to handle this situation?

Answer 1

Apparently the ng-repeat happens later, after your link function is run: https://stackoverflow.com/a/13771751/215945

You may want to try using two directives, similar to the tabs and pane directives on the Angular home page example. The radio-buttons directive could define a method (using this) on its controller that the radio-button directive could call when clicked.

For details on how the tabs and pane directives communicate, see https://stackoverflow.com/a/14168699/215945