Acceda a las propiedades del padre con un bucle de manillar 'cada'
Considere los siguientes datos simplificados:
var viewData = {
itemSize: 20,
items: [
'Zimbabwe', 'dog', 'falafel'
]
};
Y una plantilla de Manillar:
{{#each items}}
<div style="font-size:{{itemSize}}px">{{this}}</div>
{{/each}}
Esto no funcionará porque dentro del eachbucle, no se puede acceder al ámbito principal, al menos no de la forma que he intentado. ¡Espero que haya una manera de hacer esto!
Hay dos formas válidas de lograrlo.
Eliminar la referencia al ámbito principal con../
Al anteponer ../el nombre de la propiedad, puede hacer referencia al ámbito principal.
{{#each items}}
<div style="font-size:{{../itemSize}}px">{{this}}</div>
{{#if this.items.someKey}}
<div style="font-size:{{../../itemSize}}px">{{this}}</div>
{{/if}}
{{/each}}
Puedes subir varios niveles repitiendo el archivo ../. Por ejemplo, para subir dos niveles utilice ../../key.
Para obtener más información, consulte la documentación de Manillar sobre rutas .
Desreferenciar el alcance raíz con@root
Al anteponer @rootla ruta de la propiedad, puede navegar hacia abajo desde el alcance superior (como se muestra en la respuesta de caballerog ).
Para obtener más información, consulte la documentación de Manillar sobre variables @data .
El nuevo método utiliza notación de puntos, la notación de barra diagonal está en desuso ( http://handlebarsjs.com/expressions.html ).
Entonces, el método real para acceder a los elementos padres es el siguiente:
@root.grandfather.father.element
@root.father.element
En su ejemplo específico, usaría:
{{#each items}}
<div style="font-size:{{@root.viewData.itemSize}}px">{{this}}</div>
{{/each}}
Otro método de la documentación oficial ( http://handlebarsjs.com/builtin_helpers.html ) es usar alias
Cada ayudante también admite parámetros de bloque, lo que permite referencias con nombre en cualquier parte del bloque.
{{#each array as |value key|}} {{#each child as |childValue childKey|}} {{key}} - {{childKey}}. {{childValue}} {{/each}} {{/each}}Creará una variable de clave y valor a la que los niños podrán acceder sin la necesidad de referencias variables detalladas. En el ejemplo anterior, {{key}} > es idéntico a {{@../key}} pero en muchos casos es más legible.
Supongamos que necesita utilizar ifuna declaración dentro eachdel bloque. Utilice la propiedad incorporada lookuppara llegar a un objeto raíz cuya clave se puede proporcionar dinámicamente mediante un eachbucle externo, por ejemplo.
Lo siguiente también funciona tanto en un eachbucle como en un bucle anidado :each
{{#each anArray}}
{{#each (lookup ../anObject this)}}
{{#if (lookup @root name)}}
`Something to be shown if the value of 'name' here can be found as a key at the root object and, if its value is boolean, its value is 'true'.`
{{/if}}
{{/each}}
{{/each}}
anArrayes una matriz dada en el objeto raíz.
anObjectes un objeto dado en el objeto raíz.
anObjecttiene una namepropiedad.
