我想使用 Angular Material 提供的选项卡,以便为我的应用程序提供两个不同的选项。这些选项卡位于我的应用程序的导航栏中。然而,选项卡切换应该只触发点击事件,因为两个选项卡的主要内容是相同的(在导航栏下方)。
所以现在,我尝试使用没有任何内容的 md-tabs,只需单击 ng-click,但这似乎不起作用。
Oc 我可以在导航栏中使用 sime 按钮,但我想要动画和 Material 选项卡的红线,这对于按钮来说似乎是不可能的。
谁知道如何解决我的问题?
现在的代码:
<md-content flex="" layout-padding="" class="md-small">
<md-toolbar>
<div class="md-toolbar-tools">
<h2>
<span ng-click="moveTo(53.534980, 9.975195)">Some Header</span>
</h2>
<span flex="5"></span>
<md-tabs class="md-accent" md-selected="data.selectedIndex" md-align-tabs="top">
<md-tab id="tab1">
<md-tab-label>Item One</md-tab-label>
<md-tab-body>
</md-tab-body>
</md-tab>
<md-tab id="tab3">
<md-tab-label>Item Three</md-tab-label>
<md-tab-body>
</md-tab-body>
</md-tab>
</md-tabs>
<span flex=""></span>
<md-button class="md-icon-button md-primary" aria-label="Settings" ng-click="toggleRight()">
<md-icon md-svg-icon="images/menu.svg"></md-icon>
</md-button>
</div>
</md-toolbar>
<span flex></span>
</md-content>
最佳答案
您可以在选项卡
上使用md-on-select="dosomething()"
。
<md-tabs class="md-accent" md-selected="data.selectedIndex" md-align-tabs="top">
<md-tab id="tab1" md-on-select="doThis()">
<md-tab-label>Item One</md-tab-label>
<md-tab-body>
</md-tab-body>
</md-tab>
<md-tab id="tab3" md-on-select="doThat()">
<md-tab-label>Item Three</md-tab-label>
<md-tab-body>
</md-tab-body>
</md-tab>
</md-tabs>
关于angularjs - 具有相同内容的 md-tabs Angular Material,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35745310/