Stache attribute formatting

The stache attribute can be formatted as follows:

    <div {}="text;property1:prop1Value;property2:prop2Value;">This is replaced by default</div>

The names for "text", "property1", etc can be changed to match the data object properties. The element property to be assigned can be a property of a child object, for example "style.color:colorValue".

The data object would be setup as follows:

    var data = { text: 'My text', property1:prop1Value, property2:prop2Value };

Example for populating an address component

HTML

    <div>
        <b>Name:</b> <span {}="name"></span><br />
        <b>Address:</b> <span {}="address"></span><br />
        <b>City:</b> <span {}="city"></span>, <span {}="state"></span> <b>Zipcode:</b> <span {}="zipcode" data-storage=""></span><br />
    </div>

Javascript

    var address = { name:'John Doe', address:'1234 Maple', city:'Anytown', state:'US', zipcode:'80000' };

Example changing address name style

HTML

    <div>
        <b>Name:</b> <span {}="name"></span><br />
        <b>Address:</b> <span {}="address"></span><br />
        <b>City:</b> <span {}="city"></span>, <span {}="state"></span> <b>Zipcode:</b> <span {}="zipcode" data-storage=""></span><br />
        </div>

Javascript

    var address = { name: { text:'Jill', style:'color:cyan;'}, address:'1234 Maple', city:'Anytown', state:'US', zipcode:'80000' };