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

时间:2015-02-17 13:58:57

标签: polymer

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

<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寄存器的纸质按钮,在寄存器元素中启动功能toogle ...但实际上,它只是不起作用...

你能帮帮我吗?谢谢:))

1 个答案:

答案 0 :(得分:0)

切换&#39;错误的范围。 &#39; quizzito登录&#39;必须切换&#39;函数在on-register-tap =&#34; {{toogle}}&#34;案件。 为什么你不打电话给quizzito-register-dialog&#39;直接功能?获取&#39; quizzito-register-dialog&#39;元素并致电谷歌。

<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>