Angular Material选项卡不会携带数据属性

时间:2016-01-19 03:13:20

标签: javascript angularjs angular-material

我正在使用Angular Material tabs<md-tabs>)。在tab元素上添加data属性(如data-filter)时,内置的Material指令在转换它们时不会将其带过来。

例如,这是我的标记:

<div ng-app="MyApp">
  <md-content>
    <md-tabs md-dynamic-height="" md-border-bottom="">
      <md-tab label="one" data-filter="tab-one">
        <md-content class="md-padding">
          <p>Tab 1</p>
        </md-content>
      </md-tab>
      <md-tab label="two" data-filter="tab-two">
        <md-content class="md-padding">
          <p>Tab 2</p>
        </md-content>
      </md-tab>
    </md-tabs>
  </md-content>
</div>

这是Angular Material渲染后的tab-one标记:

<md-tab-item tabindex="-1" class="md-tab ng-scope ng-isolate-scope md-ink-ripple md-active" style="max-width: 1280px" ng-repeat="tab in $mdTabsCtrl.tabs" role="tab" aria-controls="tab-content-0" aria-selected="true" aria-disabled="false" ng-click="$mdTabsCtrl.select(tab.getIndex())" ng-class="{'md-active': tab.isActive(), 'md-focused': tab.hasFocus(), 'md-disabled': tab.scope.disabled }" ng-disabled="tab.scope.disabled" md-swipe-left="$mdTabsCtrl.nextPage()" md-swipe-right="$mdTabsCtrl.previousPage()" md-tabs-template="::tab.label" md-scope="::tab.parent">
  <span class="ng-scope">one</span>
  <div class="md-ripple-container"></div>
</md-tab-item>

从上面可以看出,它内部没有data-filter="tab-one"。有没有办法修改或挂钩指令以提取所有数据属性?

Working Example

编辑:进行了进一步的测试,并且它也没有带来ID或类。

0 个答案:

没有答案