一个元素中的按钮如何调用另一个元素的函数

Question

我有一个聚合物元素登录：

<polymer-element name="quizzito-login" attributes="">
    <template>
        <style></style>
        <paper-shadow class="card" z="2">*****

      <paper-input-decorator label="Mail">
          <input id="Mail" is="core-input" name="Mail"/>
      </paper-input-decorator>

      <paper-input-decorator label="Mots de passe">
          <input id="password" is="core-input" name="j_password" type="password"/>
      </paper-input-decorator>

      <paper-button raised id="register" on-tap="{{registerTapped}}" class="register">S'enregistrer</paper-button>

      <paper-fab mini icon="done" class="button" title="done"></paper-fab>
      <quizzito-register-dialog on-register-tap="{{toogle}}"></quizzito-register-dialog>

    </paper-shadow>
    </template>
    <script>
        Polymer('quizzito-login', {
            created: function() {
                console.log("Module de login crée");
            },
        registerTapped: function(event, detail, sender) {
            this.fire('register-tap');
            }
        });
    </script>
</polymer-element>

还有一个寄存器元素，它是一个带有寄存器输入的弹出窗口。

<polymer-element name="quizzito-register-dialog" attributes="">
    <template>
        <paper-action-dialog backdrop style="color: #00BCD4; width: 350px;" id="registerDialog" heading="S'enregistrer" transition="paper-dialog-transition-bottom">

        <paper-input-decorator label="Prénom" style="color: black;">
          <input id="name" is="core-input" name="name"/>
        </paper-input-decorator>
        <paper-input-decorator label="Nom">
          <input id="lastName" is="core-input" name="lastName" style="color: black;"/>
        </paper-input-decorator>
        <paper-dropdown-menu label="Votre classe" style="color: black; width:100%;">
            <paper-dropdown class="dropdown">
              <core-menu class="menu" style="color: black;">
                  <paper-item>304511 - Informaticien 1ère</paper-item>
                  <paper-item>304521 - Informaticien 2ème</paper-item>
                  <paper-item>304531 - Informaticien 3ème</paper-item>
                  <paper-item>304541 - Informaticien 4ème</paper-item>
              </core-menu>
            </paper-dropdown>
          </paper-dropdown-menu>
        <paper-input-decorator label="E-mail" style="color: black;">
          <input id="mail" is="core-input" name="mail"/>
        </paper-input-decorator>
        <paper-input-decorator label="Mots de passe" style="color: black;">
          <input id="pass" is="core-input" name="pass"/>
        </paper-input-decorator> 
        <paper-input-decorator label="Confirmation du mots de passe" style="color: black;">
          <input id="pass2" is="core-input" name="pass2"/>
        </paper-input-decorator>

        <paper-button dismissive="">Annuler</paper-button>
        <paper-button affirmative="" default="">Confirmer</paper-button>

        </paper-action-dialog>
    </template>
    <script>
        Polymer('quizzito-register-dialog', {
            created: function() {
                console.log("Module de registre crée");
            },
            toogle: function(event, detail, sender) {
            console.log("TOOOOGLE");
  }
        });
    </script>
</polymer-element>

现在，我希望在登录时单击带有 id register 的纸质按钮，启动 register 元素中的 toogle 功能...但实际上，它不起作用...

你能帮帮我吗？谢谢:)

Answer 1

'toggle' 的范围错误。 'quizzito-login' 必须在 on-register-tap="{{toogle}}" 情况下具有 'toggle' 功能。为什么不直接调用 'quizzito-register-dialog' 函数？获取 'quizzito-register-dialog' 元素并调用 toogle。

<polymer-element name="quizzito-login" attributes="">
<template>
    <style></style>
    <paper-shadow class="card" z="2">

  <paper-input-decorator label="Mail">
      <input id="Mail" is="core-input" name="Mail"/>
  </paper-input-decorator>

  <paper-input-decorator label="Mots de passe">
      <input id="password" is="core-input" name="j_password" type="password"/>
  </paper-input-decorator>

  <paper-button raised id="register" on-tap="{{registerTapped}}" class="register">S'enregistrer</paper-button>

  <paper-fab mini icon="done" class="button" title="done"></paper-fab>
  <quizzito-register-dialog id="registerDialog" on-register-tap="{{toogle}}"></quizzito-register-dialog>

</paper-shadow>
</template>
<script>
    Polymer('quizzito-login', {
        created: function() {
            console.log("Module de login crée");
        },
    registerTapped: function(event, detail, sender) {
    this.$.registerDialog.toogle();
        }
    });
</script>

一个元素中的按钮如何调用另一个元素的函数

How can a button from an element call a function of another element

polymer