我有以下几点:

<div>{{modal.title}}</div>

有没有一种方法可以限制字符串的长度,比如20个字符?

一个更好的问题是,有没有一种方法可以将字符串更改为截断并显示。如果超过20个字符?


当前回答

使用自定义Angular过滤器限制字数: 下面是我如何使用Angular过滤器来限制使用自定义过滤器显示的字数。

HTML:

<span>{{dataModelObject.TextValue | limitWordsTo: 38}} ......</span>

角/ Javascript代码

angular.module('app')
.filter('limitWordsTo', function () {
    return function (stringData, numberOfWords) {
        //Get array of words (determined by spaces between words)
        var arrayOfWords = stringData.split(" ");

        //Get loop limit
        var loopLimit = numberOfWords > arrayOfWords.length ? arrayOfWords.length : numberOfWords;

        //Create variables to hold limited word string and array iterator
        var limitedString = '', i;
        //Create limited string bounded by limit passed in
        for (i = 0; i < loopLimit; i++) {
            if (i === 0) {
                limitedString = arrayOfWords[i];
            } else {
                limitedString = limitedString + ' ' + arrayOfWords[i];
            }
        }
        return limitedString;
    }; 
}); //End filter

其他回答

在html中,它与angular自身提供的limitTo过滤器一起使用,如下所示:

    <p> {{limitTo:30 | keepDots }} </p>

filter keepDots:

     App.filter('keepDots' , keepDots)

       function keepDots() {

        return function(input,scope) {
            if(!input) return;

             if(input.length > 20)
                return input+'...';
            else
                return input;

        }


    }

我将使用以下三元操作符替代来完成截断…遵循:

<div>{{ modal.title.length > 20 ? (modal.title | limitTo : 20) + '...' : modal.title }}</div>
< div >{{modal.title | limitTo:20}}...< / div>

你可以使用这个npm模块:https://github.com/sparkalow/angular-truncate

将截断过滤器注入到你的应用模块中,如下所示:

var myApp = angular.module('myApp', ['truncate']); 

在你的应用程序中这样应用过滤器:

{{ text | characters:20 }} 

对我来说还行 'In span', ng-show = "MyCtrl.value.$viewValue. "长度> your_limit"…阅读更多。“结束时间”