使用AngularJs和MVC在Accordion中分组数据和显示

我是MVC和AngularJs的新手，已经为此辛苦了好几天。虽然我觉得我越来越近了。。。。仍然没有雪茄。

问题：我有一个按报告类型（名称）分组的报告列表。我试着用手风琴来显示和隐藏每组报告的列表。

我的controller.js是这样的（我知道它是错误的）：

window.app.controller('relatedReportsController', ['$scope', '$timeout', 'relatedReportsService',
function ($scope, $timeout, relatedReportService) {
    initialize();
    function initialize()
    {
        $scope.relatedReports = [];
        $scope.rollupVisible = false;
    }
    function sortOn(collection, name)
    {
        collection.sort(
            function (a, b) {
                if (a[name] <= b[name]) {
                    return (-1);
                }
                return (1);
            });
    }
    $scope.groupBy = function (attribute) {
        $scope.Groups = [];
        sortOn($scope.relatedReports, attribute);
        for (var i=0; i< $scope.relatedReports.length; i++)
        {
            var report = $scope.relatedReports[i];
        }
    }
    $scope.toggleRollup = function($event)
    {
        if (angular.element($event.targe).hasClass('glyph')) return;
        relatedReportService.$promise.then(function (data) {
            $scope.relatedReports = data;
        })
    }
    }]);

我的页面如下：

                <li class="fruitRollup header row" ng-controller="relatedReportsController">
                <div class="suitcaseheader">
                    <span class="col-xs-10 zero firstlabel">{{group.Name}}</span>
                    <span class="col-xs-3 zero datepad">Date</span>
                    <span class="floatR2">View</span>
                    <span class="clear"></span>
                </div>
                <div class="eaten">
                     <ul class="data">
                        @*@foreach (var reportResult in resultGroup.OrderByDescending(r=>r.Date))
                        {*@
                            <li class="data row" ng-repeat="report in group.reports" ng-controller="relatedReportsController">
                                <div class="suitcase">
                                    <span class="col-xs-10 zero accountNumberColumn"></span>
                                    @*<span class="middle zero">@reportResult.Date.Replace("12:00:00","")</span>*@
                                    <span class="middle zero">{{report.Date}}</span>
                                    <span class="floatR2">
                                        <a class="icon-view glyph" target="_blank" href="@Url.ActionEncodedParameters("ViewDocument", "DocumentSearch", new { id = reportResult.Id })"></a>
                                    </span>
                                    <span class="clear"></span>
                                </div>

正如你所看到的，我需要很多帮助。提前感谢！