2013-07-26 8 views
7

Chcę użyć jednej funkcji pomocnika w innej funkcji pomocnika. W poniższym kodzie chcę podświetlić nazwisko, jeśli zawiera słowo "Finch". Mam za to klasę helpera. Jeśli użyjemy w pliku hbs, składnia będzie miała postać {{highlight name}}. Ale jak go używać, ponieważ muszę go używać w innej klasie pomocnika.Jak wywołać jedną niestandardową funkcję pomocnika w innym niestandardowym pomocniku

Poniżej jest mój kod:

Handlebars.registerHelper('fullName', function(person) { 
    return person.firstName + " " + person.lastName; 
    }); 

    Handlebars.registerHelper('highlight', function(person) {  
var item = (person.lastName).replace('Finch', '<span style="color: red">' 
    + Finch + '</span>'); 
return new Handlebars.SafeString(item); 
    }); 

Oto skrzypce pracy: http://jsfiddle.net/wC6JT/4/

Oto skrzypce gdzie "highlight" pomocnika nazywa .: http://jsfiddle.net/wC6JT/3/. Nie spowoduje to żadnych wyników, ponieważ otrzymamy błędy konsoli dla osoby.nazwa nie zostanie rozpoznana w pomocniczym pomocniku rejestru.

Chcę użyć "podświetl" pomocnika w pełnoprawnym pomocniku dla osoby.nazwa. Jak można to osiągnąć.

+0

@muistooshort: Zaktualizowałem mój kod i skrzypce. Jego literówka. to jest person.lastName – Cindrella

Odpowiedz

4

Wyodrębnij zawartość metody, którą chcesz zastosować w pierwszej metodzie, do własnej metody javascript. Następnie wywołaj tę metodę javascript w obu pomocnikach, jeśli to konieczne.

Nie możesz tego zrobić, dopóki nie zmienisz zawartości jednej z metod w jej własnej metodzie javascript.

Więc w twoim przypadku powinno to wyglądać mniej więcej tak:

Handlebars.registerHelper('fullName', function(person) { 
    return person.firstName + " " + highlightJavascript(person); 
    }); 

Handlebars.registerHelper('highlight', highlightJavascript); 

highlightJavascript : function(person) { 
    var item = (person.lastName).replace('Finch', '<span style="color: red">' 
    + Finch + '</span>'); 
return new Handlebars.SafeString(item); 
} 
+0

Oto skrzypce: to nie zadziałało. http://jsfiddle.net/wC6JT/14/. Jeśli usunę zaznaczenie pomocnika, to działa, ale wyświetla cały tag zamiast rzeczy html. – Cindrella

+0

Nie jestem pewien, co poszło nie tak z skrzypcami, ale zaimplementowałem w mojej aplikacji i działa idealnie. Dziękuję Ci. – Cindrella

+1

Nie powinien "Handlebars.registerHelper (" wyróżnij ", wyróżnijJavascript (osoba));' be 'Handlebars.registerHelper ('highlight', highlightJavascript);'? Chcesz nadać 'registerHelper' funkcję, nie nazywaj tego. –

1

można używać w ten sposób: http://goo.gl/oY4IIO nie musi złączyć ciąg.

<script id="tmp" type="text/x-handlebars-template"> 
    <p>test: {{test "2.3333333"}}</p> 
    <p>format: {{format "2.3333333"}}</p> 
</script> 

Handlebars.registerHelper('format', function (value) { 
    return parseFloat(value).toFixed(2); 
}); 
Handlebars.registerHelper('test', function (value) { 
    var source = '{{format x}}'; 
    var context = {x:value}; 
    var html = Handlebars.compile(source)(context); 
    return new Handlebars.SafeString(html); 
}); 
$(document).ready(function() { 
    var source = $('#tmp').html(); 
    var template = Handlebars.compile(source); 
    var html = template(); 

    $('#main').html(html); 
}); 

wyjściowa: Test: 2,33 format: 2,33

+0

Powinieneś zamieścić główną treść z linku, tak jakby link zmieniał twoją odpowiedź byłby nieprawidłowy. –

+0

@ user3250923: Hmm Nice one.Ale po długim czasie. Dzięki za link. Dołącz treść linku. – Cindrella

2

Aby wywołać pomocnika kierownica z innej funkcji, można użyć Handlebars.helpers:

Handlebars.registerHelper('fullName', function(person) { 
    var lastName = Handlebars.helpers.highlight.apply(this, [person.lastName]); 
    var firstName = Handlebars.Utils.escapeExpression(person.firstName); 
    return new Handlebars.SafeString(firstName + " " + lastName); 
}); 

Handlebars.registerHelper('highlight', function(str) {  
    var safeStr = Handlebars.Utils.escapeExpression(str); 
    var item = safeStr.replace("Finch", "<em>Finch</em>"); 
    return new Handlebars.SafeString(item); 
}); 

Tutaj jest działające skrzypce: http://jsfiddle.net/acLcsL6h/1/

Przeczytaj this blog post dla innego przykładu.