Ember 2: обрезать текст и добавить эллипсы

Question

Я ищу простой аддон или помощник для длинных строк, которые будут усекать, а также добавить эллипсы. Я нашел несколько примеров с помощником handlebar, но я думаю, что большинство из них устарело. Я создал ember helper, называемый truncate-text, и попытался объединить примеры, но не увенчался успехом. Кроме того, если есть способ определить предел в количестве символов для каждого случая использования, это будет бонус.

Вот что у меня есть в моих помощниках/truncate-text.js import Ember from 'ember';

export function truncateText(text) { 
    if (text.length > 60) { 
    var theString = text.substring(0, 60) + " ... "; 
    return new Ember.Handlebars.SafeString(theString); 
    } else { 
    return text; 
    } 
} 

export default Ember.Helper.helper(truncateText); 

В моем template.hbs {{truncate-text text="Long text here."}

Был бы признателен, если я могу сделать это {{truncate-text text="Long text here." limit=65}}

Answer 1

Вот пример помощника укоротить текст на основе предельного значения для:

function truncateText(params, hash) { 
    const [ value ] = params; 
    const { limit } = hash; 
    let text = ''; 

    if (value != null && value.length > 0) { 
    text = value.substr(0, limit); 

    if (value.length > limit) { 
     text += '...'; 
    } 
    } 

    return text; 
} 

export default Ember.Helper.helper(truncateText); 

И тогда вы использовали бы его в шаблонах, как показано ниже:

{{truncate-text "Lorem ipsum dolor long text" limit=5}} 

Вы можете посмотреть демо здесь https://ember-twiddle.com/fcb02795216a206b64dc

Answer 2

обычно вам не нужно JavaScript для этого, вы можете использовать CSS вместо

.text { 
    overflow: hidden; 
    text-overflow: ellipsis; 
    width: 100px; 
    background: green; 
    white-space: pre; 
} 

JSbin