javascript – 如何在angularjs材质设计中显示标题居中对齐的标签

我正在关注我的网页中的标签链接.

https://material.angularjs.org/latest/demo/tabs

这是标签的代码.

<div ng-cloak>
  <md-content>
    <md-tabs md-dynamic-height md-border-bottom>

      <md-tab label="one">
        <md-content class="md-padding">
            <p> Tab 2 contents</p>
        </md-content>
      </md-tab>

      <md-tab label="two">
        <md-content class="md-padding">
            <p> Tab 2 contents</p>
        </md-content>
      </md-tab>

      <md-tab label="three">
        <md-content class="md-padding">
            <p> Tab 3 contents</p>
        </md-content>
      </md-tab>
    </md-tabs>
  </md-content>
</div>

上面的代码显示了HTML页面左侧的标签

如何在HTML页面的中心显示标签？

我还有一个要求. tab1内容​​中有一个按钮.点击该按钮如何移动到第二个选项卡？

解决方法:

You can use Following link to align centre/left/bottom etc the Heading/any elements

https://material.angularjs.org/latest/layout/alignment

例如： – layout =“row”layout-align =“center center”

用于制作向导的标签

控制器逻辑： –

$scope.max = 2; // max you can put your number 
  $scope.selectedIndex = 0;
  $scope.nextTab = function() {
    var index = ($scope.selectedIndex == $scope.max) ? 0 : $scope.selectedIndex + 1;
    $scope.selectedIndex = index;

  };

Html： –

   <md-tabs md-dynamic-height="" md-border-bottom="" md-selected="selectedIndex" md-center-tabs="true">
      .....
   </md-tabs>

Plunker在行动： –

http://plnkr.co/edit/rOh0Yy?p=preview

标签：javascript,css,angularjs,angular-material,html
来源： https://codeday.me/bug/20190716/1475486.html