2016-10-21 7 views
1

(送信ボタン)は、複数のpaper-inputフィールド/エレメントに関連しています。 paper-inputボタンは、ユーザが関連するすべてのフィールド/エレメント(newメールおよびpasswd)を入力する限り、無効にする必要があります。紙のボタンの無効な属性を切り替えます

これは

<gold-email-input id="newEmail" 
        label="Email" 
        no-label-float required> 
    </gold-email-input> 

    <paper-input id="passwd" 
       type="password" 
       label="Password" 
       no-label-float required> 
    </paper-input> 

    <div class="buttons"> 
    <paper-button dialog-dismiss>Cancel</paper-button> 
    <paper-button dialog-confirm autofocus 
        disabled$="[[isInputEmpty($$.newEmail.value, $$.passwd.value)]]" 
        on-tap="changeEmail" 
        class="default">Save</paper-button> 
    </div> 

機能無効$ = "[[isInputEmpty($$。newEmail.value、$$。passwd.value)]]"ウォン」要素の重要な部分でありますnewEmail.valueまたはpassdw.valueが変更されたときに呼び出されます。

これは、JavaScriptの一部です:

isInputEmpty (email, pass) { 
    if (email.length === 0 || pass.length === 0) return true; 
    return false; 
    } 

属性無効間とを切り替えるための正しい実装は何ですか?

答えて

2
  1. disabled実際property of <paper-button>(ない属性)であるので、あなたはattribute-binding syntax(すなわち、$=)を使用しないで必要があります。

    <!-- don't do this --> 
    <!-- 
    <paper-button disabled$="[[isInputEmpty(...)]]"> 
    --> 
    
    <paper-button disabled="[[isInputEmpty(...)]]"> 
    
  2. あなたの結合にnewEmailpasswdの値を渡すしようとしているが、あなたは正しい構文を使用していません。

    <gold-email-input value="{{email}}"></gold-email-input> 
    <paper-input value="{{password}}"></paper-input> 
    <paper-button disabled="[[isInputEmpty(email, password)]]"></paper-button> 
    
:あなたは、あなたの計算された結合で引数として渡すプロパティにそれらの入力から値をバインドする必要があります
関連する問題