For loop with jsrender pattern

Question

In my working scenario, I use the following code snippet in a js render template:

{{:#data['" + columnName + "']}} 

and this will return a value like:

[object Object],[object Object]

How to get a specific property from this array object [object Object],[object Object]in js render template using for loop?

Answer 1

You can use {{for}}to iterate over an array. Something like that:

<ul>
{{for columnName}}
  <li>{{:Property}}</li>
{{/for}}
</ul>

Inside the loop, your base area automatically becomes that particular object in the array, so you can output any of the properties of the object directly using {{:Property}}.

Answer 2

, . http://www.jsviews.com/#fortag. ( ).

, :

, columnName. , columnName "fooColumn", {{:#data['fooColumn']}} - {{:#data.fooColumn}}, {{:fooColumn}}.

( , columnName JavasScript, "foo column", , - .)

, #data.fooColumn - , 'itemProperty', {{for}} ( ):

<ul>
  {{for fooColumn}}
    <li>{{:itemProperty}}</li>
  {{/for}}
</ul>

, columnName,

"<ul>{{for " + columnName + "}}<li>{{:itemProperty}}</li>{{/for}}</ul>"

Answer 3

, , jsrender . StudentList {{for StudentList}}{{/for}}.

, {{props}}{{/props}} {{>key}} {{>prop}}

Doc: https://www.jsviews.com/#propstag

JSON:

<!-- language: lang-json -->

"StudentList": [
        {
            "RollNo": 1,
            "Name": "John Doe",
            "Subject": "Maths"            
        },
        {
            "RollNo": 2,
            "Name": "Jane Doe",
            "Subject": "Physics"            
        },
        ...

Render Template:

<!-- language: lang-html -->

{{for StudentList}}
    <tr>
        {{props #data}}
            <td>{{>key}}</td><td>{{>prop}}</td>
        {{/props}}
    </tr>
{{/for}}