Lenker Helfer innen {{#each}}

Question

Ich versuche einen registrierten Lenker Helper innerhalb einer {{#each}} Schleife zu rufen. Leider beschwert sich Ember.js, weil es versucht, den Helfer als eine Eigenschaft des Controllers und nicht als Helfer aufzulösen.

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

(Namen und Inhalt sind nur Dummy-Werte um das Beispiel zu zeigen)

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

Der Fehler, dass die Ember.js druckt ist:

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

Wie kann ich anrufen müssen der registrierte Helfer, damit er erkannt wird?

Answer 1

Verstanden läuft, entweder mit this solution,

Javascript

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

Lenker Vorlage

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

Oder noch besser, mit dieser:

Javascript

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

Lenker Vorlage

<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

Meine Helfer sind in einzelne Dateien geschrieben, so dass ich geändert @ Antwort MikeAski ist, die folgenden werden.

In helpers/my-helper.js:

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

export 
default MyHelper; 

An der Spitze der app.js:

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

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

Dann haben Sie nicht einmal die {{#with}} in Lenker müssen, genauso wie ein normaler Helfer verwenden.

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

Answer 3

Wenn Sie nicht wollen, einen globalen Helfer verwenden, dann können Sie eine „pathed Abfrage“ verwenden:

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

../ ist die Syntax für eine pathed Abfrage. Es bewirkt, dass Sie die Ebene des Oszilloskopbaums 1 durchlaufen und auf private Daten eines übergeordneten Bereichs zugreifen. Um zwei Ebenen nach oben zu durchlaufen, können Sie folgendes tun: ../../. Dies ist nützlich, wenn Sie for-Schleifen verschachtelt haben.