AngularMaterial Tabs showing only 1st tab - angularjs

Question

Why are md-tabs showing only the first tab? The rest of them appears after I click in the tabs area.
First tab looks like this:
After clicking in the tab area:
My code looks like this:
<md-tabs md-dynamic-height md-border-bottom>
<md-tab label="Home"></md-tab>
<md-tab label="Profile"></md-tab>
<md-tab label="Messages"></md-tab>
</md-tabs>
On purpose I left the content of tabs empty because I want to get rid of the transition animation as described here.
One of the problems could be that the tabs are in bootstrap dropdown menu.
Thank you for your ideas!
EDIT
I have just found out that the tabs has troubles even without bootstrap when using them in md-menu.

Answer 1

Have you solved it yet?
I'm having the same problem except that my angular tabs is in bootstrap's modal.
When I click on a button to toggle the modal it only show the first tab until I click on it.
After doing some testing it appears that I could work around by hiding the angular tabs with ng-show and show it after a small amount of delay.
<button ng-click="controller.showTabs()">Show Tab</button>
<md-tabs md-dynamic-height md-border-bottom ng-show="show_tab">
<md-tab label="Home"></md-tab>
<md-tab label="Profile"></md-tab>
<md-tab label="Messages"></md-tab>
</md-tabs>
Controller's function when user clicks on the drop down / button to toggle the modal:
this.showTabs =
function()
{
//250ms delay
$timeout(function()
{
$scope.show_tab = true;
},250);
}