How to call function defined inside Polymer Custom Element and pass arguments?

大兔子大兔子 提交于 2019-12-25 03:33:08

问题


I have html page using polymer builtin elements along with my customElement(my-form)

<dom-module id="my-form">
    <template>
        <div>
            <paper-input id="inputName" label="Name" required error-message="Required Input" value="{{data.name}}"> Name </paper-input>
            <paper-input id="inputAge" label="Age" required error-message="Required Input" value="{{data.age}}"> Age </paper-input>
            <div class="rows layout horizontal">
                <paper-button id='cancelBtn' tabindex="0">Cancel</paper-button>
                <paper-button id='saveBtn' tabindex="0">Save</paper-button>
            </div>
        </div>
    </template>
</dom-module>
<script>
    Polymer({

        is: 'my-form',

        created: function() {
            var saveBtn = document.querySelector('#saveBtn');
            saveBtn.addEventListener('click', function() {
                document.getElementById('inputName').validate();
                document.getElementById('inputAge').validate();
            });

            //initial value
            this.data = {};  

        },

        properties: {
            data: {
                type: Object,
                value: {},
            },
        }

        //load my-form with data provided  
        refreshFormUI: function(dataReceived) {
            this.data = dataReceived;
            console.log("refreshFormUI() -  name = " + this.data.name);
            console.log("refreshFormUI() -  age = " + this.data.age);
        },

    });
</script>

I need to pass the "data"object from a external javascript file. I tried the following but I dont see the refreshFormUI() being called.

external_js_file.js :

function someEvent() {
    my_form_element = document.querySelector('#my_form_element');
    var mockData = {
        name: "Demo Name",
        age: '20',
    };
    my_form_element.refreshFormUI(mockData);
}

回答1:


You're setting this.data = but then in your console.log you're using data.name instead of this.data.name.



来源:https://stackoverflow.com/questions/31170930/how-to-call-function-defined-inside-polymer-custom-element-and-pass-arguments

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!