Question

<dom-module id="my-view1">
  <template id="methodScope">
    <paper-dialog id="modal1">
      <paper-swatch-picker></paper-swatch-picker>
      <paper-button dialog-confirm autofocus>Fertig</paper-button>
    </paper-dialog>
    <paper-toast id="copiedColor" text="Farbe in die Zwischenablage kopiert!"></paper-toast>
  </template>

  <template id="create" is="dom-if" if="{{mapChosen}}" restamp="true">
    <iron-ajax auto url$="{{mapJson}}" handle-as="json" last-response="{{mapData}}"></iron-ajax>

    <paper-button id="button1">Data</paper-button>
  </template>

  <script>
    Polymer({
      is: 'my-view1',
      attached: function(event) {
        dialog = this.$.modal1;
        colorPick = this.$.colorpicker;
        var self = this;
        this.$.colorpicker.addEventListener('color-picker-selected',function() {
          self._alertColor()
          self.selectedColor = colorPick.color;
          self.copyToClipboard(colorPick.color);
          dialog.close();
          console.log("fired");
        })
      }
      var button = this.$.button1;
    });
 </script>
</dom-module>

访问dom-if模板之外的元素非常有效，但无论我做什么，我都无法在其中访问它们。我已经尝试使用this.async和this.$$ - 所有返回undefined。如何使用dom-if和ID“创建”来访问模板中的按钮？

我已经削减了一些代码，所以如果你没有看到某些功能或其他东西，那是因为那个

Answer 1

尝试收听dom-change事件。以下是dom-repeat的示例，但同样适用于dom-if

<base href="https://polygit.org/components/">
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="polymer/polymer.html">
<dom-module id="repeat-completion">
  <template>
    <style></style>
    <template is="dom-repeat" items="{{items}}" as="item" on-dom-change="_domComplete">
      <div id$="num{{index}}">{{item}}</div>
    </template>
  </template>
</dom-module>
<script>
  Polymer({
    is: 'repeat-completion',
    properties: {
      items: {
        type: Array,
        value: function() {
          return [1, 2, 3, 4, 5]
        }
      }
    },
    _domComplete: function(e) {
      if (e.returnValue)
        console.log(this.$$("#num1"));
    }
  })
</script>


<repeat-completion></repeat-completion>

Polymer - dom-if模板中的访问元素

1 个答案: