How to use multiple <content> tags in one polymer element?
I am trying to access the same data in one element twice, one for desktop navigation and one for easy navigation (drawer toolbar). For this, I use two content tags, but it only accepts one. In this case, what to do
<app-drawer-layout force-narrow>
<app-drawer id="drawer">
<app-toolbar></app-toolbar>
<!-- Nav on mobile: side nav menu -->
<paper-menu selected="{{selected}}" attr-for-selected="name">
<template is="dom-repeat" items="{{items}}">
<paper-item name="{{item}}">{{item}}</paper-item>
</template>
</paper-menu>
</app-drawer>
<app-header-layout>
<app-header class="main-header">
<app-toolbar>
<paper-icon-button class="menu-button" icon="menu" drawer-toggle hidden$="{{wideLayout}}"></paper-icon-button>
</app-toolbar>
<app-toolbar class="tabs-bar" hidden$="{{!wideLayout}}">
<!-- Nav on desktop: tabs -->
<paper-tabs selected="{{selected}}" attr-for-selected="name" bottom-item>
<template is="dom-repeat" items="{{items}}">
<paper-tab name="{{item}}">{{item}}</paper-tab>
</template>
</paper-tabs>
</app-toolbar>
</app-header>
</app-header-layout>
</app-drawer-layout>
<iron-media-query query="min-width: 600px" query-matches="{{wideLayout}}"></iron-media-query>
Polymer Code:
Polymer({
is: 'x-app',
properties: {
selected: {
type: String,
value: 'Item One'
},
wideLayout: {
type: Boolean,
value: false,
observer: 'onLayoutChange',
},
items: {
type: Array,
value: function() {
return ['Item One', 'Item Two', 'Item Three', 'Item Four'];
}
}
},
onLayoutChange: function(wide) {
var drawer = this.$.drawer;
if (wide && drawer.opened) {
drawer.opened = false;
}
}
});
I have this type of code. What to do to add a menu item without using an array. I want to add them separately from the index both in the application header and in the application. but in the index it should be written once, as shown below.
<wt-header logo="logo url" enable-menu="true" enable-topbar="false">
<wt-menu>
<wt-tab name="TabName" action="http://example.com/action" />
<wt-tab name="TabName1" action="http://example.com/action2" />
<wt-tab name="TabName3" action="http://example.com/action3" />
</wt-menu>
</wt-header>
+4
1 answer
, . <content> "" , , . <content> - , .
, select=".some", , <content>, , (, .some), <content select=".some"> <content>.
, <template>...</template>, templatizer, . , , <template is="dom-repeat"> <iron-list>
0