Дизайн кутового матеріалу не працює з ng-repeat - angularjs, angularjs-директива, кутовий-матеріал

https://material.angularjs.org/1.1.0-rc2/demo/fabSpeedDial

Я намагаюся створити швидкий набір md з різними кнопками, але, здається, анімація перестає працювати, тому що я додаю більше кнопок з ng-repeat.

Це мій html

<div class="markeroptions">
<md-fab-speed-dial md-direction="up" class="md-fling">
<md-fab-trigger>
<md-button aria-label="menu" class="md-fab md-primary">
<md-icon md-svg-src="images/location.svg"></md-icon>
</md-button>
</md-fab-trigger>

<md-fab-actions>
<md-button ng-repeat="mapoption in mapoptions" aria-label="Twitter" class="md-fab md-raised md-mini">
<md-icon class="locationicon" md-svg-src="{{mapoption.icon}}" aria-label="Twitter"></md-icon>
</md-button>
</md-fab-actions>
</md-fab-speed-dial>
</div>

Швидкий набір відкривається правильно, але коли я закриваю його, я отримую цю проблему.

Як я можу це виправити, так що анімація поводиться так само, як в демо-версії дизайну кутових матеріалів?

Дякую!

Відповіді:

Потрібно обернути вміст у повторюваному розділі. https://github.com/angular/material/issues/8079

Так, арея правильна. Зроби це

<div ng-repeat="mapoption in map options">
<md-button aria-label="Twitter" class="md-fab md-raised md-mini">
<md-icon class="locationicon" md-svg-src="{{mapoption.icon}}" aria-label="Twitter">
</md-icon>
</md-button>
</div>