Hi 

I am trying to loop through the array of objects using dom-repeat and 
getting below error 

Polymer::Attributes: couldn't decode Array as JSON: {{test}}

I tried changing attr type as Array and Object but no luck .

I found solution for similar error message  here 
- https://github.com/Polymer/polymer/issues/1693

But I am using the same solution suggested but getting same error again 

Codepen-  https://codepen.io/nagasai/pen/bRJvbK

HTML:

<head>
<base href=
"https://polygit.org/polymer+v2.0.0/shadycss+webcomponents+1.0.0/components/";
>
<link rel="import" href="polymer/polymer.html">
<div class="toolbar">
</head>


<body>
        
<dom-module id="custom-form">
  <template>
    <style>
      :host {
        display: block;
      }




    </style>
    <div>


   <div>
     <pre>[[attr]]</pre>
     <template is="dom-repeat" items="{{attr}}">
             <label>{{item.title}}</label>
             <input type="{{item.type}}"
                    required="{{item.required}}"
                    value="{{item.value}}"
                    disabled="{{item.disabled}}"
                    size="{{item.size}}"
                    oninput="{{item.oninput}}"
                    on-click="{{item.onclick}}"
                    onchange="{{item.onchange}}"
                    onfocus="{{item.onfocus}}"
                    onkeydown="{{item.onkeydown}}"
                    onkeypress="{{item.onkeypress}}"
                    onkeyup="{{item.onkeyup}}()"
                    >
         </template>
   </div>


    </div>




  </template>




</dom-module>
  <custom-form attr="{{test}}"></custom-form>
</body>

JS:

/**
     * @customElement
     * @polymer
     */


class CustomForm extends Polymer.Element {
  static get is() {
    return "custom-form";
  }
  static get properties() {
    return {
      attr: {
        type: Array
      }
    };
  }
}
customElements.define(CustomForm.is, CustomForm);


let test = [
  {
    element: "input",
    type: "text",
    title: "Name",
    name: "name",
    value: "",
    size: "30",
    class: "",
    required: "required",
    disabled: "",
    onblur: "",
    onchange: "",
    onclick: "display()",
    onfocus: "",
    oninput: "",
    onkeydown: "",
    onkeypress: "",
    onkeyup: "",
    id: 0
  },
  {
    element: "checkbox",
    type: "checkbox",
    title: "Checkbox",
    name: "name",
    value: "",
    size: "30",
    class: "",
    required: "required",
    disabled: "",
    onchange: "",
    onclick: "",
    onselect: "",
    id: 1
  }
];


function display(){
  alert("hi");
}

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/83dc1d6e-0692-40fd-8393-4e340969dc5c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to