Question

当我使用md-tabs将一个选项卡放在另一个选项卡中时，我尝试在md-align-tabs属性的上部选项卡上进行更改，它也会反映在内部选项卡中。

如何阻止这种情况发生

＆＃13;

<md-content  layout="column" layout-fill>
	<md-tabs layout="column" class="md-primary" md-selected="data.selectedIndex" md-align-tabs="{{checks[data.selectedIndex] ?'bottom':'top'}}" layout-fill >
      <md-tab id="Tab{{checkBottom}}" ng-repeat="checkBottom in checkDataBottom">
         <md-tab-label>Tab{{checkBottom+1}}</md-tab-label>
          <md-tab-body>
		  <div class="md-padding" layout="row" layout-sm="column" layout-align="left center">
           <md-checkbox ng-value="true" ng-model="checks[checkBottom]" ng-change="change()" aria-label="Align tabs to bottom?" style="margin: 5px;">Tab to bottom</md-checkbox>
           <md-content  layout="column" layout-fill>
              <md-tabs layout="column" class="md-primary" md-selected="data2.selectedIndex" md-align-tabs="{{checksX[data2.selectedIndex] ?'bottom':'top'}}" layout-fill >
               	<md-tab id="Tab{{checksXy}}" ng-repeat="checksXy in checkDataBottom">
                  	<md-tab-label>Tab{{checksXy+1}}</md-tab-label>
                  	<md-tab-body>
				      <div class="md-padding" layout="row" layout-sm="column" layout-align="left center">
            		    <md-checkbox ng-value="true" ng-model="checksX[checksXy]" ng-change="change()" aria-label="Align tabs to bottom?" style="margin: 5px;">Tab to bottom</md-checkbox>
                       </div>
         		   </md-tab-body>
               	 </md-tab>
              </md-tabs>
         	</md-content>
         </div>
        </md-tab-body>
       </md-tab>
      </md-tabs>
    </md-content>

＆＃13;

Answer 1

看起来像角质材料中的某种虫子。但是尝试添加

md-tabs[md-align-tabs="top"] > md-tabs-wrapper{
    bottom: initial;
    left: initial;
    right: initial;
    position: initial;
    height: initial;
    z-index: initial;
}

到您的CSS文件，我认为这会有所帮助。

以下是codepen中的示例：http://codepen.io/anon/pen/qRNmwV

选项卡中的Angular Material选项卡问题

1 个答案: