Accedere a una variabile al di fuori dell'ambito di un Handlebars.js ogni ciclo

188

Ho un modello handlebars.js, proprio come questo:

{{externalValue}}

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

E questo è l'output generato:

myExternalValue

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

Come previsto, posso accedere ai campi ide titledi ogni elemento myCollectionper generare la mia selezione. E al di fuori della selezione, la mia externalValuevariabile è stampata correttamente ("myExternalValue").

Sfortunatamente, nei testi delle opzioni, il externalValuevalore non viene mai stampato.

La mia domanda è: come posso accedere a una variabile al di fuori dell'ambito di handlebars.js all'interno del loop?

— lucke84
fonte

Risposte:

454

Provare

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

Il ../segmento del percorso fa riferimento all'ambito del modello principale che dovrebbe essere quello desiderato.

— spliter
fonte

Se i futuri lettori hanno ancora problemi come me, dai un'occhiata al commento per questa risposta qui. Mi ci è voluto un po 'di tempo dopo aver visto questa risposta per vederla. Potrebbe essere necessario utilizzare ../più volte in base al numero di ambiti lontano dal valore che si è.

— bcmcfc,

Sono pazzo o questo tipo di informazioni preziose non si trova in nessun punto sui documenti del manubrio ???

— Jesse,

@spliter funzionerà sul manubrio di brace .. sembra non funzionare

— kweku360

Nessuna idea @ kweku360. Funziona con i normali hadlebar. Potrebbe essere che Ember stia utilizzando la versione personalizzata del manubrio in cui questa funzionalità è implementata con un altro mezzo

— spliter

Grazie amico, funziona perfettamente anche con Foundation 6 Panini.

— Marco,

Oppure puoi usare un percorso assoluto come questo:

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

— kidkkr
fonte

Ho visto molti link con 404 per la documentazione su questo argomento.

Lo aggiorno con questo, funziona nel 1 ° aprile 2020 :

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

Alcuni helper come #with e #each consentono di immergersi in oggetti nidificati. Quando includi segmenti ../ nel percorso, i manubri torneranno al contesto principale.

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

Anche se il nome viene stampato nel contesto di un commento, può comunque tornare al contesto principale (l'oggetto root) per recuperare il prefisso.

AVVERTIMENTO

Il valore esatto che ../ risolverà varia in base all'helper che sta chiamando il blocco. L'uso di ../ è necessario solo quando il contesto cambia. I figli di aiutanti come {{#each}} richiederebbero l'uso di ../ mentre i figli di aiutanti come {{#if}} no.

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

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

In questo esempio tutto quanto sopra fa riferimento allo stesso valore di prefisso anche se si trovano all'interno di blocchi diversi. Questo comportamento è nuovo a partire da Handlebars 4, le note sulla versione illustrano il comportamento precedente e il piano di migrazione.

— titoih
fonte