Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Autoría | Ultima modificación | Ver Log | 

<!DOCTYPE html>
<html>
<head>
        <script src="http://code.jquery.com/jquery-3.5.1.js" type="text/javascript"></script>
        <script src="../../jsrender.js" type="text/javascript"></script>
        <link href="../resources/demos.css" rel="stylesheet" type="text/css" />
</head>
<body>
<a href="../demos.html">JsRender Demos</a><br />

<h3>Accessing paths</h3>

<script id="peopleTemplate" type="text/x-jsrender">

        <b>{{:#index+1}}:</b> {{>firstName}} {{>lastName}}:

        <br/>
        {{for address tmpl="#addressTemplate"}}{{else}}
                Address missing
        {{/for}}

        <div>
                Phones:
                {{for ~combine(phones, cells)}}
                        <b>{{>#data}}</b> ({{>#parent.parent.data.firstName}}'s)
                {{else}}
                        {{>#parent.data.firstName}} has no phones or cells
                {{/for}}

{{!-- or provide an alias to get to firstName from nested content
                Phones:
                {{for ~combine(phones, cells) ~frstNm=firstName}}
                        <b>{{>#data}}</b> ({{>~frstNm}}'s)
                {{else}}
                        {{>~frstNm}} has no phones or cells
                {{/for}}
--}}
        </div>

        <br/>

        <i>
                {{>firstName}}

                {{if address && address.street}}  {{!-- address may be null or undefined --}}
                        lives in {{>address.street}}.
                {{else}}
                        has no address...
                {{/if}}
        </i>
        <hr/>

</script>

<script id="addressTemplate" type="text/x-jsrender">
<div>
        {{if street}}
                {{>street}}
        {{else}}
                <i>Somewhere</i> in
        {{/if}}
        {{>city}}
</div>
</script>

<div id="peopleList"></div>

<script type="text/javascript">
        var people = [
                {
                        firstName: "Pete",
                        lastName: "Ruffles",
                        address: {
                                city: "Bellevue"
                        },
                        cells: ["425 666 3455", "425 222 1111"]
                },
                {
                        firstName: "Xavier",
                        lastName: "NoStreet",
                        phones: ["222 666 3455"],
                        cells: ["444 666 3455", "999 222 1111"]
                },
                {
                        firstName: "Christie",
                        lastName: "Sutherland",
                        address: {
                                street: "222 2nd Ave NE",
                                city: "Redmond"
                        }
                }
        ];

        $.views.tags({
                notLast: function( content ) {
                        var array = this.parent.data;
                        return array[ array.length - 1 ] === this.data ? "" : content( this );
                }
        });

        $.views.helpers({
                combine: function( arr1, arr2 ) {
                        return arr1 && arr2 ? arr1.concat(arr2) : arr1 || arr2;
                }
        });

        $( "#peopleList" ).html(
                $( "#peopleTemplate" ).render( people )
        );

</script>

</body>
</html>