grid-directive.js

app.directive('grid', function() {
    return {
        scope: {
            panels: "="
        },
        templateUrl: 'partials/templates/grid.html',
        link: function($scope, element, attributes ) {
            //console.debug(angular.element($scope.panels[0]));
            $scope.$on('panel_done', function(event, panelElement) {
                console.debug(panelElement);
            });

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

grid.html

<div style="display: none;">
    <div ng-repeat="panel in panels" on-repeat-done="panel_done" id="{{panel._id}}" class="panel panel-default">
        <div class="panel-heading">
            <span>{{panel.name}}</span>
            <span class="panel-options">
                <a href="" ng-click="delete($index)">Delete</a>
                <a href="" ng-click="open(panel)">Edit</a>
            </span>
        </div>
        <div class="panel-body">
            <ul>
                <li ng-repeat="entry in panel.feed.entries">
                    <a target="_blank" href="{{entry.link}}">{{entry.title}}</a>
                </li>
            </ul>
        </div>
    </div>
</div>

index.html

<div class="row-fluid">
    <div id="header" class="span12">
        <a href="" ng-click="open()">+Add Content</a>
    </div>
</div>
<div class="row-fluid">
    <div id="content" class="span12">
        <div errors></div>
        <div grid panels="panels"></div>
        <div id="column1" class="span4 column"></div>
        <div id="column2" class="span4 column"></div>
        <div id="column3" class="span4 column"></div>
    </div>
</div>