问题
This might be a simple issue, but I'm new to this...
I am trying to have an md-tabs element that takes the entire screen, and have only the tabs' content scroll.
Here is an example on jsFiddle
Any ideas? thx!
回答1:
Try this:
<body ng-cloak layout="column" ng-controller="AppController as app">
<md-toolbar layout="row" class="md-toolbar-tools">
<h1>Welcome!</h1>
</md-toolbar>
<div layout="column" flex>
<md-tabs md-stretch-tabs="always" flex>
<md-tab label="Tab1">
add our larger-than-life content here
</md-tab>
<md-tab label="Tab2">
</md-tab>
</md-tabs>
</div>
</body>
Adding the flex attribute to md-tabs will make the content of the inner tabs (md-tab) scrollable.
回答2:
Try to add this style to your div element inside md-tab :
div{
height: 100px;
overflow-y: scroll;
}
Your container must be a fixed size. Also, you can play with overflow property. Read this for more information.
Thanks
回答3:
Seems like it was a bug in 0.8.3 that is fixed now in master (commit: 74601d0)
来源：https://stackoverflow.com/questions/29229300/angular-material-design-md-tab-scroll-content