我正在尝试在新元素(tabs-list)中使用paper-tabs但是在打印选项卡之后我不能使用querySelector来更改所选的.
元素代码(没有样式):
<link rel="import" href="../components/polymer/polymer.html">
<link rel="import" href="../sprint-service/sprint-service.html">
<link rel="import" href="../components/paper-tabs/paper-tabs.html">
<polymer-element name="tab-list" attributes="show">
<template>
<sprint-service id="service" sprints="{{sprints}}"></sprint-service>
<paper-tabs selected="all" valueattr="name" self-end>
<paper-tab name="all">ALL</paper-tab>
<template repeat="{{sprint in sprints}}">
<paper-tab name="{{sprint.id}}">{{sprint.id}}</paper-tab>
</template>
</paper-tabs>
</template>
<script>
Polymer('tab-list', {
ready: function() {
var tabs = document.querySelector('paper-tabs');
tabs.addEventListener('core-select', function() {
list.show = tabs.selected;
})
}
});
</script>
</polymer-element>
Run Code Online (Sandbox Code Playgroud)
Index.html代码(whitout样式):
<!doctype html>
<html>
<head>
<title>unquote</title>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<script src="../components/platform-dev/platform.js"></script>
<link rel="import" href="../components/font-roboto/roboto.html">
<link rel="import"
href="../components/core-header-panel/core-header-panel.html">
<link rel="import"
href="../components/core-toolbar/core-toolbar.html">
<link rel="import" href="tab-list.html"> …
Run Code Online (Sandbox Code Playgroud)