访问 dom-在 dom 中重复 - 如果来自 javascript

Question

是否可以从 JavaScript 访问 dom-if 中的 dom-repeat？

<template is="dom-if" if={{someCondition}}>
  <template is="dom-repeat" items={{data}}></template>
</template>

我可以使用 this.$.id 访问 dom-if，但是如何访问 dom-repeat？

Answer 1

您必须使用 DOM API 的 this.$$(selector) 功能。根据文档

$$ returns the first node in the local DOM that matches selector.

Polymer({
  is: 'my-elem',
  
  accessSelector: function() {
    alert(this.$$('div').textContent);
  }
});

<!DOCTYPE html>
<html>
<head>
  <base href="https://polygit.org/components/">
  <script src="webcomponentsjs/webcomponents-lite.min.js"></script>
  <link href="polymer/polymer.html" rel="import"/>
</head>

<body>
  <my-elem></my-elem>
  
  <dom-module id="my-elem">
    <template>
      <template is="dom-if" if="true">
        <template is="dom-repeat" items='[ 1, 2, 3 ]'>
          <div>Item: {{item}}</div>
        </template>
      </template>
      
      <button on-tap="accessSelector">Selector</button>
    </template>
  </dom-module>

</body>
</html>

访问 dom-在 dom 中重复 - 如果来自 javascript

Access dom-repeat inside a dom-if from javascript

javascript

polymer

polymer-1.0