动态排列 md-dialog 标签

Question

我的标签对话框如下所示：

如您所见，选项卡（“DESCRIPTION,MEANS,...）在可用空间中排列不均匀。我尝试了 flex 指令，但它不起作用。

我的 html 是这样的（缩短的）：

    <md-toolbar>
  <div class="md-toolbar-tools">
    <h2>{{error}}</h2>
    <span flex></span>
    <md-button class="md-icon-button" ng-click="cancel()">
      <md-icon md-svg-src="../../../assets/img/close.svg" aria-label="Close dialog"></md-icon>
    </md-button>
  </div>
</md-toolbar>
<md-dialog-content style="max-width:800px;max-height:1400px;min-width:800px; ">
  <md-tabs md-dynamic-height md-border-bottom>
    <md-tab label="description">
      <md-content class="md-padding">
        <h1 class="md-display-2">Description</h1>
        <p flex>{{description}}</p>
      </md-content>
    </md-tab>
    <md-tab label="means">
      <md-content class="md-padding">
        <h1 class="md-display-2">Means</h1>
        <p>{{means}}</p>
      </md-content>
    </md-tab>

有什么方法可以实现我想要的这种标签排列方式吗？

Answer 1

在 md-tabs 中添加 md-stretch-tabs="always" check this