Назначение функции опубликованному атрибуту

Question

У меня есть пользовательский полимерный элемент, который является формой и имеет что-то вроде этого.

Dart сценарий:

@CustomTag('my-form') 
class MyForm extends PolymerElement { 
    @published Function submitFunction; 

    validateAndSubmit() { 
     // validate 
     submitFunction(); 
    } 
} 

HTML:

<polymer-element name="my-form"> 
    <template> 
     <button id="submitButton" on-click="{{ validateAndSubmit }}">Submit</button> 
    </template> 
</polymer-element 

При нажатии кнопки отправить щелкают, функция представить будет называться, но как вы можете видеть, что это должно быть установлено на что-то первым , Я использую этот элемент несколько раз на одной странице, и для каждой формы мне нужно сделать что-то другое.

В моей основной я это:

@CustomTag('my-form') 
class MyCustomForm extends MyForm { 
    // The below commented out line would work if I only had one form. 
    // var submitFunction = submitForm1; 

    submitForm1() { 
     // do stuff with form 1 
    } 

    submitForm2() { 
     // do stuff with form 2 
    } 
} 

И в HTML:

<my-form id="form1" submitFunction="{{ submitForm1 }}"></my-form> 
<my-form id="form2" submitFunction="{{ submitForm2 }}"></my-form> 

Но это не работает. Функции submitForm не запускаются вообще. Какие-либо предложения?

Answer 1

Для Polymer вам необходимо добавить штрих в поле события on-click вместо onclick.

В зависимости от версии Polymer вы используете вы должны аннотирования функции с

@enventHandler // Polymer <= 1.0.0-rc.1 
@reflectable // Polymer >= 1.0.0-rc.2 

Polymer 1.0 весьма ограничительным, что возможно/допускается в обязательных выражениях. Пространства может вызвать проблемы слишком

"{{ submitForm1 }}" 

попробовать

"{{submitForm1}}" instead 

Answer 2

Для инициализации submitFunction программно (для полимеров < 0.17.0), добавьте ниже.

@whenPolymerReady 
onReady() { 
    MyForm form1 = (querySelector("#form1") as MyForm); 
    form1.submitTo = methodToCallOnSubmit(); 
    // same for form 2. 
}