Asked By: Anonymous
Is it possible to access a dom-repeat
that is present inside a dom-if
from JavaScript?
<template is="dom-if" if={{someCondition}}>
<template is="dom-repeat" items={{data}}></template>
</template>
I can access the dom-if
using this.$.id
, but how can I access the dom-repeat
?
Solution
Answered By: Anonymous
You have to use the this.$$(selector)
function of the DOM API. As per the docs
$$ returns the first node in the local DOM that matches selector.
Polymer({_x000D_
is: 'my-elem',_x000D_
_x000D_
accessSelector: function() {_x000D_
alert(this.$$('div').textContent);_x000D_
}_x000D_
});
_x000D_
<!DOCTYPE html>_x000D_
<html>_x000D_
<head>_x000D_
<base href="https://polygit.org/components/">_x000D_
<a href="http://webcomponentsjs/webcomponents-lite.min.js">http://webcomponentsjs/webcomponents-lite.min.js</a>_x000D_
<link href="polymer/polymer.html" rel="import"/>_x000D_
</head>_x000D_
_x000D_
<body>_x000D_
<my-elem></my-elem>_x000D_
_x000D_
<dom-module id="my-elem">_x000D_
<template>_x000D_
<template is="dom-if" if="true">_x000D_
<template is="dom-repeat" items='[ 1, 2, 3 ]'>_x000D_
<div>Item: {{item}}</div>_x000D_
</template>_x000D_
</template>_x000D_
_x000D_
<button on-tap="accessSelector">Selector</button>_x000D_
</template>_x000D_
</dom-module>_x000D_
_x000D_
</body>_x000D_
</html>
_x000D_
_x000D_
x000D