Question

我正在尝试在Angular应用中使用Polymer paper-tabs组件。我有这样的标记：

<paper-tabs noink selected="0">
   <paper-tab class="tab1" data-ng-click="currentTab='tab1'">Tab1</paper-tab>
   <paper-tab class="tab2" data-ng-click="currentTab='tab2'">Tab2</paper-tab>
</paper-tabs>

我希望能够将选定的paper-tab绑定到角度范围字段，这样，如果我更新范围字段，标记将重新呈现以选择与范围字段以某种方式关联的新选项卡新价值。

这可能吗？似乎选择配置哪个选项卡的唯一方法是通过selected上的paper-tabs attribte。但是，如果您在页面生命周期内以编程方式更新此值（通过jQuery或通过角度绑定），那么它不会导致选项卡在选中新选项卡的情况下重新呈现。

Answer 1

看起来您正在使用标准的聚合物纸张元素。据我所知，这些web组件不能很好地与AngularJS一起玩，因此创建了Angular Material项目

从example：

中执行您需要的Angular材质

<md-tabs selected="selectedIndex">
  <md-tab ng-repeat="tab in tabs | orderBy:predicate:reversed" on-select="onTabSelected(tab)" on-deselect="announceDeselected(tab)" disabled="tab.disabled">
      <md-tab-label>
          {{tab.title}}
      </md-tab-label>
      {{tab.content}}
  </md-tab>
</md-tabs>

Answer 2

如果您正在寻找＆＃34; 标准聚合物纸张元素的解决方案 ＆＃34;。

尝试ng-polymer-elements

AngularJS Web组件的双向绑定，支持Polymer Core和Paper元素

刚刚为我测试过，效果很好，在你的情况下使用：

<paper-tabs noink ng-model="currentTab">

link：https://gabiaxel.github.io/ng-polymer-elements/

所选聚合物纸张的双向角度装订

2 个答案:

尝试ng-polymer-elements