Hello,In response to your issue, I wanted to let you know about just released MDBootstrap Angular kit, that may be a sufficient solution to this or any other issues you have had with Angular integration so far.The kit can be found at the following link:https://mdbootstrap.com/angular/It contains all the components you could find in MDB jQuery version.We encourage you to try it out and report any bugs or issues at contact@mdbootstrap.com with [Angular] prefix or create a thread on this forum.Have a great day!

CSS

.menuItem:not(.collapsed) i:after {
    content: "f106";
    -webkit-transition: all 150ms ease-in 0s;
    -moz-transition: all 150ms ease-in 0s;
    -o-transition: all 150ms ease-in 0s;
    -ms-transition: all 150ms ease-in 0s;
    transition: all 150ms ease-in 0s;               
}
.menuItem.collapsed i:after {
    content: "f106";
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);                     
}
.menuItem i:after {
    position: absolute;
    right: 3%;
    margin-top: -13px;
    -webkit-transition: all 150ms ease-in 0s;
    -moz-transition: all 150ms ease-in 0s;
    -o-transition: all 150ms ease-in 0s;
    -ms-transition: all 150ms ease-in 0s;
    transition: all 150ms ease-in 0s;
}

HTML

    <div class="accordion" id="accordion" role="tablist">
        <div class="panel panel-default" ng-repeat="menu in vm.menu">
            <div class="panel-heading arrow-r menuItem collapsed waves-effect"  data-toggle="collapse" id="headingOne_{{$index}}" href="#collapseOne_{{$index}}">
                {{menu.title}} #{{$index}}<i class="fa"></i>
            </div>
            <div id="collapseOne_{{$index}}" class="panel-collapse collapse" role="tabpanel">
                <div ng-repeat="item in menu.item">
                    {{item}}
                </div>
            </div>
        </div>
    </div> 

JavaScript

angular.module("myApp", []).controller("ctrl", init);

function init() {
    var vm = this;
    vm.menu = [
        {
            title: "aaa",
            item: [
                "AAA",
                "AAAA"
            ]
        },
        {
            title: "bbb",
            item: [
                "BBB",
                "BBBB"
            ]
        },
        {
            title: "ccc",
            item: [
                "CCC",
                "CCCC"
            ]
        }                
    ]
}