Acceda a una variable fuera del alcance de un Handlebars.js cada bucle


188

Tengo una plantilla handlebars.js, así:

{{externalValue}}

<select name="test">
    {{#each myCollection}}
       <option value="{{id}}">{{title}} {{externalValue}}</option>
    {{/each}}
</select>

Y esta es la salida generada:

myExternalValue

<select name="test">
       <option value="1">First element </option>
       <option value="2">Second element </option>
       <option value="3">Third element </option>
</select>

Como se esperaba, puedo acceder a los campos idy titlede cada elemento myCollectionpara generar mi selección. Y fuera de la selección, mi externalValuevariable se imprime correctamente ("myExternalValue").

Desafortunadamente, en los textos de opciones, el externalValuevalor nunca se imprime.

Mi pregunta es: ¿cómo puedo acceder a una variable fuera del alcance de los manillares.js cada uno desde dentro del bucle?

Respuestas:


454

Tratar

<option value="{{id}}">{{title}} {{../externalValue}}</option>

El ../segmento de ruta hace referencia al alcance de la plantilla principal que debería ser lo que desea.


10
Si los futuros lectores siguen teniendo problemas como yo, eche un vistazo al comentario de esta respuesta aquí. Me tomó un tiempo después de ver esta respuesta para ver esa. Es posible que deba usarlo ../repetidamente dependiendo de cuántos alcances del valor que tenga.
bcmcfc

10
¿Estoy loco o no se puede encontrar este tipo de información valiosa en los documentos del manillar?
Jesse

1
@spliter funcionará en los manillares de ascuas ... parece que no funciona
kweku360

1
No tengo idea @ kweku360. Esto funciona para los hadlebars normales. Podría ser que Ember está utilizando versión personalizada del manillar donde se incorpore esta función con otro medio
Spliter

1
Gracias hombre, esto funciona perfectamente también con Foundation 6 Panini.
Marco

13

O puede usar una ruta absoluta como esta:

<option value="{{id}}">{{title}} {{@root.user.path.to.externalValue}}</option>

1

Vi muchos enlaces con 404 para documentación sobre este tema.

Lo actualizo con este, está funcionando el 1 de abril de 2020 :

https://handlebarsjs.com/guide/expressions.html#path-expressions

Algunos ayudantes como #with y #each le permiten sumergirse en objetos anidados. Cuando incluye ../ segmentos en su ruta, los Manillares volverán a cambiar al contexto principal.

    {{#each people}}
    {{../prefix}} {{firstname}} 
    {{/each}}

Aunque el nombre se imprime en el contexto de un comentario, aún puede volver al contexto principal (el objeto raíz) para recuperar el prefijo.

ADVERTENCIA

El valor exacto que ../ resolverá varía según el ayudante que está llamando al bloque. Usar ../ solo es necesario cuando el contexto cambia. Los hijos de ayudantes como {{#each}} requerirían el uso de ../ mientras que los hijos de ayudantes como {{#if}} no.

{{permalink}}
{{#each comments}}
  {{../permalink}}

  {{#if title}}
    {{../permalink}}
  {{/if}}
{{/each}}

En este ejemplo, todo lo anterior hace referencia al mismo valor de prefijo aunque estén ubicados dentro de diferentes bloques. Este comportamiento es nuevo a partir de Handlebars 4, las notas de la versión analizan el comportamiento anterior, así como el plan de migración.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.