角材料标签不起作用（md-tabs）

Question

使用角材料打开使用内容主体（https://material.angularjs.org/latest/demo/dialog）中的标签的对话框。现在对话框弹出，但我可以看到第一个标签的内容，并没有看到标签选项从一个标签切换到另一个标签。添加html代码段：

<md-dialog-content style="max-width:800px;max-height:810px; "> 
     <md-tabs md-dynamic-height md-border-bottom> 
     <md-tab label="one"> 
      <md-content class="md-padding"> 
      <h1 class="md-display-2">Tab One</h1> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla venenatis ante augue. Phasellus volutpat neque ac dui mattis vulputate. Etiam consequat aliquam cursus. In sodales pretium ultrices. Maecenas lectus est, sollicitudin consectetur felis nec, feugiat ultricies mi.</p> 
      </md-content> 
     </md-tab> 
     <md-tab label="three"> 
      <md-content class="md-padding"> 
      <h1 class="md-display-2">Tab Three</h1> 
      <p>Integer turpis erat, porttitor vitae mi faucibus, laoreet interdum tellus. Curabitur posuere molestie dictum. Morbi eget congue risus, quis rhoncus quam. Suspendisse vitae hendrerit erat, at posuere mi. Cras eu fermentum nunc. Sed id ante eu orci commodo volutpat non ac est. Praesent ligula diam, congue eu enim scelerisque, finibus commodo lectus.</p> 
      </md-content> 
     </md-tab> 
     </md-tabs> 
    </md-dialog-content> 

Answer 1

角度材料不能很好地计算宽度。这发生在我身上，我定将它添加到md-stretch-tabs="always"和md-tabs取消对父容器柔性：

<div> 
    <md-content> 
     <md-tabs md-dynamic-height md-stretch-tabs="always" md-border-bottom> 
      <md-tab label="three"> 
       <md-content class="md-padding"> 
        <h1 class="md-display-2">Tab Three</h1> 
        <p>Integer turpis erat, porttitor vitae mi faucibus, laoreet interdum tellus. Curabitur posuere molestie dictum.</p> 
       </md-content> 
      </md-tab> 
     </md-tabs> 
    </md-content> 
</div> 

这样做变化使得AngularJS计算好标签的大小调整。小心并且不要在md-tabs容器上使用flex，因为它会在某些情况下使其失败。

Answer 2

我有同样的问题，并尝试了各种方法之后，这次终于工作：

包含在你的CSS文件中的以下CSS代码：

md-pagination-wrapper { 
    width:500px !important; 
}