2012-04-13 9 views
10

Jestem nowy w Handlebars systemie szablonów i jest to mój pierwszy projekt, nad którym pracuję z kierownicą. Stworzyłem prosty szablon:Kierownice - podciągi

<script id="article_list_template" type="text/x-handlebars-template"> 
    {{#each this}} 
    <div class='article'> 
    <a href='article.php?id={{id_news}}' data-article_id='{{id_news}}'> 
     <h1>{{title}}</h1> 
    </a> 
     <p> {{{content}}} </p> 
    <div style='clear: both;'> </div> 
    </div> 
    {{/each}} 
</script> 

Zwrócony content jest bardzo długi. Chcę, żeby był krótszy, np. 150 znaków. Starałem się używać JavaScript substring() metodę następująco:

<p> {{{content.substring(0,150)}}} </p>

Ale to oczywiście nie działa. Czy możesz dać mi kilka wskazówek, jak sobie z tym problemem poradzić? Dzięki

Edit: Ok, problem rozwiązany: Zrobiłem go w PHP, tak że wrócił zawartość ma teraz właściwą długość:

foreach ($articles as $a) { 
    $a->content = cut_text($a->content, 30); 
} 
+0

Aby zamknąć pytanie, przedstawić swoje rozwiązanie i przyjmuję je jako odpowiedź. – craniumonempty

Odpowiedz

19

Będziesz chcesz utworzyć pomocnika kierownicy w javascript, aby wykonać kod podciąg:

Handlebars.registerHelper('trimString', function(passedString) { 
    var theString = passedString.substring(0,150); 
    return new Handlebars.SafeString(theString) 
}); 

Następnie w szablonie, można nazwać to tak:

<p> {{{trimString content}}} </p> 
+3

Możesz również uczynić "150" argumentem dla pomocnika. –

-1

Alternatywnie, można napisać funkcję kierownica pomocnika wykonać podciąg

0

Rozwiązałem mój problem w PHP. Mam zmodyfikowany skrypt PHP, a teraz zwrócona treść ma odpowiednią długość.

foreach ($articles as $a) { 
    $a->content = cut_text($a->content, 30); 
} 
1

moich określić pomocnika sznurkiem cięcia wskazują

Handlebars.registerHelper('trimS', function(passedString, start, length){ 
var mlength = length,preS='',tailS=''; 
if(start>0 && passedString.length>3){ 
    var preS= '...'; 
    mlength = length -3; 
} ; 
if(passedString.length>(start + length)){ 
    tailS = '...'; 
    mlength = mlength -3; 
}; 
var theString = preS + passedString.substr(start, mlength) + tailS; 
return new Handlebars.SafeString(theString); 
}); 
0

Yeh handlebars helper to zdecydowanie droga do przodu;

Oto mój pomocnik, który pozwala określić i zakończyć punkt + również umieszcza "...", jeśli string.length> end.

Handlebars.registerHelper('substring', function(string, start, end) { 

    var theString = string.substring(start ,end); 

    // attach dot dot dot if string greater than suggested end point 
    if(string.length > end) { 
     theString += '...'; 
    } 

    return new Handlebars.SafeString(theString); 
}); 

Wewnątrz szablonu:

<p>{{{substring myString 0 100}}}</p> 
4

Dla tych, którzy pracują z EmberJS, tu jest moja interpretacja pomocnika substr:

Ember.Handlebars.registerHelper('substr', function(property, options) { 

    var str = Ember.get(this, property); 
    var opts = options.hash; 

    var start = opts.start || 0; 
    var len = opts.max; 

    var out = str.substr(start, len); 

    if (str.length > len) 
     out += '...'; 

    return new Ember.Handlebars.SafeString(out); 
}); 

przykłady wykorzystania:

{{substr description start=5 max=20}} 

lub

{{substr description max=20}} 

Edit: jest "związany" pomocnik jest jeszcze lepiej.

Ember.Handlebars.registerBoundHelper('substr', function(value, options) { 

    var opts = options.hash; 

    var start = opts.start || 0; 
    var len = opts.max; 

    var out = value.substr(start, len); 

    if (value.length > len) 
     out += '...'; 

    return new Ember.Handlebars.SafeString(out); 
}); 

ten współpracuje również z właściwości zagnieżdżonych:

{{substr view.product.description max=50}} 
+0

return new Ember.Handlebars.SafeString (out); – Pierozi

+0

edytowane, dziękuję – Alex

21

Używam wartości jako opcji, wartość początkowa, jak i kończąc wartości przekazywane jako argumenty szablon formularza. Spróbuj tego:

Handlebars.registerHelper('trimString', function(passedString, startstring, endstring) { 
    var theString = passedString.substring(startstring, endstring); 
    return new Handlebars.SafeString(theString) 
}); 

W szablonie:

<p>{{{trimString value 0 300}}}</p> 

będziemy drukować pierwsze 300 znaków wartości. Mam nadzieję, że to ci pomoże.

+1

To powinna być poprawna odpowiedź, jest bardziej kompletna niż druga. – azuax

+0

Dzięki .. @ Azuax – Naitik

1

Handlebars.registerHelper('truncate', function(passedString, startstring, endstring) { 
 
    if(passedString){ 
 
     if(!startstring) startstring=0; 
 
     if(!endstring) endstring=30; 
 
     var theString = passedString.substring(startstring, endstring); 
 
     return new Handlebars.SafeString(theString+'...'); 
 
    } 
 
});

Wystarczy trochę łagodzeniu jako weryfikacji passedString, a wartość domyślna dla startString i Endstring. dodam „...” na końcu łańcucha obcięty :)

Wystarczy zadzwonić kierownicę z {{obciąć your_text_variable 0 50}}

Powiązane problemy