Obliczone wiązania w szablonach z automatycznym wiązaniem w Polymer 1.0

Question

Jak zdefiniować powiązania obliczeniowe w szablonach z automatycznym wiązaniem (to znaczy tych zadeklarowanych jako <template is='dom-bind'>...</template>)?

Answer 1

Wystarczy przypisać obliczone powiązanie bezpośrednio do elementu szablonu za pomocą skryptu, upewniając się, że związane z nim właściwości są inicjowane po definicji obliczonego powiązania.

przykład:

<template is="dom-bind"> 
    <div> 
    <input value="{{text::input}}"> 
    </div> 
    <div>[[describe(text)]]</div> 
</template> 

<script> 
    (function() { 
    var template = document.querySelector('template[is="dom-bind"]'); 

    template.describe = function(text) { 
     if (text) { 
     return 'You entered "' + text + '", which is ' + text.length + ' characters long.'; 
     } else { 
     return 'You didn\'t even enter a thing! Shame on you.'; 
     } 
    }; 

    template.text = ''; 
    })(); 
</script>