<div class="demo-preview-block"> <p> <h5>Customized 'ObservableProperty'</h5> Now it's: <span mdl-observe="time"></span><br> </p> <div class="object-test"> <h5>Observes Object (_Name) with 'null' check</h5> <div mdl-observe="isNameNull | choose(value, '(Name-Object is null!)','')"></div> <div mdl-observe="nameObject" class="name mdl-color--100"> {{! ----- Turn off default mustache interpretation (sitegen) ---- }} {{= | | =}} <template> <div> Firstname: {{first}},<br> Last name: {{last}}<br> <div>Text in <strong>DIV</strong></div> </div> </template> |= {{ }} =| {{! ----- Turn on mustache ---- }} </div> </div> <p> <h5>Observable-List</h5> Wait 2 secs - A timer will add 10 more List-Items!<br> If you "REMOVE" "German" - it will be replace with "Austrian"<br><br> Nr. of records: <strong><span mdl-observe="records"></span></strong><br> <div mdl-repeat="language in languages"> {{! ----- Turn off default mustache interpretation (sitegen) ---- }} {{= | | =}} <template> <div class="language" > Language: {{language.name}} ({{language.type}}) <button class="mdl-button mdl-js-button mdl-button--colored mdl-js-ripple-effect" data-mdl-click="remove({{language.name}})">Remove</button> </div> </template> |= {{ }} =| {{! ----- Turn on mustache ---- }} </div> </p> </div>