Doppie staffe [[]] contro doppie parentesi {{}} in Polymer

Question

Qual è un modo sintetico per spiegare la differenza tra parentesi doppie ([[...]]) e doppie parentesi ({{...}}) in Polymer 1.0?

Per esempio, nella documentazione per l'elemento <iron-list> il codice HTML di esempio mostra:

<template is="dom-bind"> 
    <iron-ajax url="data.json" last-response="{{data}}" auto></iron-ajax> 
    <iron-list items="[[data]]" as="item"> 
    <template> 
     <div> 
     Name: <span>[[item.name]]</span> 
     </div> 
    </template> 
    </iron-list> 
</template> 

Perché data delimitata da parentesi graffe doppie in uno spot (last-response="{{data}}"), ma delimitata da doppie parentesi (items="[[data]]") in un altro posto ?

Answer 1

Il binding può essere unidirezionale (utilizzando [[]]) o bidirezionale (utilizzando {{}}, ma utilizzare anche notifica).

Per spiegare il traffico di riflessione vincolante su strada. l'associazione unidirezionale è quando si aggiorna il modello, la vista viene aggiornata. Quando anche il contrario è vero, è un legame a doppio senso.

Per ulteriori informazioni vedere documentation.

Answer 2

Trovo utile pensare al bind di parentesi quadra come input per un elemento e parentesi graffa come input/output o solo output. Nella maggior parte dei casi in cui eseguo il cablaggio di un insieme di elementi, esiste, invariabilmente, una destinazione finale per i dati e si trova su un elemento che presenta le informazioni. Quella rilegatura finale utilizza parentesi quadre. Visivamente, osservando dove vengono usate le parentesi graffe e le parentesi graffe, ho un'idea di cosa sta producendo un valore (controvento) e di cosa lo sta consumando (quadrato).