Pomocnik kierownicy wewnątrz {{#each}}

Question

Próbuję wywołać zarejestrowanego pomocnika kierownicy wewnątrz pętli {{#each}}. Niestety Ember.js narzeka, ponieważ próbuje rozwiązać helpera jako właściwość kontrolera, a nie pomocnika.

Handlebars.registerHelper('testHelper', function(name) { 
    return 'foo: ' + name 
}); 

(nazwy i zawartość są tylko wartości nieużywane pokazać przykład)

{{#each entry in App.testController}} 
    <div>{{{testHelper entry.name}}}</div> 
{{/each}} 

Błąd, który drukuje ember.js jest:

Uncaught Error: Handlebars error: Could not find property 'testHelper' on object <App.testController:ember254>. 

Jak muszę zadzwonić zarejestrowany pomocnik, aby został rozpoznany?

Answer 1

Got to działa, albo z this solution,

Javascript

Handlebars.registerHelper('testHelper', function(property, options) { 
    return 'foo: ' + Ember.get(options.data.view.content, property); 
}); 

Kierownice szablon

<script type="text/x-handlebars" data-template-name='app-view'> 
    <ul> 
    {{#each entry in content}} 
    <li>{{testHelper name}}</li> 
    {{/each}} 
    </ul> 
</script>​ 

Albo jeszcze lepiej, z tego:

JavaScript

Handlebars.registerHelper('testHelper', function(property) { 
    return 'foo: ' + Ember.get(this, property); 
}); 

Kierownice szablon

<script type="text/x-handlebars" data-template-name='app-view'> 
    <ul> 
    {{#each entry in content}} 
    {{#with entry}} 
     <li>{{testHelper name}}</li> 
    {{/with}} 
    {{/each}} 
    </ul> 
</script>​ 

Answer 2

Moi pomocnicy są zapisywane w osobnych plikach, więc zmodyfikowane @ odpowiedź MikeAski by być następująca.

W helpers/my-helper.js:

var MyHelper = function(value) { 
    return moment(value).format("MMMM Do, YYYY"); 
}; 

export 
default MyHelper; 

Na szczycie app.js:

// import modules 
import myHelper from 'appkit/helpers/my-helper'; 

// register custom helpers 
Ember.Handlebars.registerBoundHelper('myHelper', myHelper); 

Wtedy nie trzeba nawet się {{#with}} w kierownicy, wystarczy użyć jako normalny pomocnika.

{{#each thing}} 
    {{myHelper thing.foo}} 
{{/each}} 

Answer 3

Jeśli nie chcesz korzystać z globalnej pomocnika następnie można użyć „pathed zapytanie”:

{{#each entry in App.testController}} 
    <div>{{{../testHelper entry.name}}}</div> 
{{/each}} 

../ jest składnia dla pathed zapytania. Powoduje przejście do poziomu drzewa zasięgu 1 i uzyskanie dostępu do prywatnych danych z zakresu nadrzędnego. Aby przejść 2 poziomy w górę, możesz wykonać następujące czynności: ../../. Jest to przydatne, jeśli masz zagnieżdżone pętle for.