我有以下几点:
<div>{{modal.title}}</div>
有没有一种方法可以限制字符串的长度,比如20个字符?
一个更好的问题是,有没有一种方法可以将字符串更改为截断并显示。如果超过20个字符?
我有以下几点:
<div>{{modal.title}}</div>
有没有一种方法可以限制字符串的长度,比如20个字符?
一个更好的问题是,有没有一种方法可以将字符串更改为截断并显示。如果超过20个字符?
当前回答
我知道这有点晚了,但在angularjs的最新版本(我使用的是1.2.16)中,limitTo过滤器支持字符串和数组,所以你可以像这样限制字符串的长度:
{{ "My String Is Too Long" | limitTo: 9 }}
它将输出:
My String
其他回答
我使用了一套非常有用的滤镜库“Angular-filter”,其中一个叫做“truncate”的也很有用。
https://github.com/a8m/angular-filter#truncate
用法是:
text | truncate: [length]: [suffix]: [preserve-boolean]
编辑 AngularJSoffers的最新版本的limitTo过滤器。
你需要一个这样的自定义过滤器:
angular.module('ng').filter('cut', function () {
return function (value, wordwise, max, tail) {
if (!value) return '';
max = parseInt(max, 10);
if (!max) return value;
if (value.length <= max) return value;
value = value.substr(0, max);
if (wordwise) {
var lastspace = value.lastIndexOf(' ');
if (lastspace !== -1) {
//Also remove . and , so its gives a cleaner result.
if (value.charAt(lastspace-1) === '.' || value.charAt(lastspace-1) === ',') {
lastspace = lastspace - 1;
}
value = value.substr(0, lastspace);
}
}
return value + (tail || ' …');
};
});
用法:
{{some_text | cut:true:100:' ...'}}
选项:
Wordwise (boolean) -如果为真,仅按单词边界切割, Max (integer) -文本的最大长度,切到这个字符数, Tail (string,默认值:'…')-将此字符串添加到输入 如果绳子被剪断,就用绳子。
另一个解决方案:http://ngmodules.org/modules/angularjs-truncate (by @Ehvince)
ng-keypress = " filterValue(事件)”ng-model = "客户。CUSTOMER_PHONE”
美元的范围。filterValue = function($event){
if(isNaN(String.fromCharCode($event.keyCode)) ){
$event.preventDefault();
}
if($scope.customer.CUSTOMER_PHONE.length <= 11)
{
$scope.customer.CUSTOMER_PHONE = $scope.customer.CUSTOMER_PHONE;
}
else
{
$event.preventDefault();
}
};
这个解决方案纯粹是在HTML上使用ng标签。
解决方案是使用“show more…”限制显示的长文本。链接。如果用户点击“显示更多…”链接,它将显示其余的文本,并删除了“show more…”的链接。
HTML:
<div ng-init="limitText=160">
<p>{{ veryLongText | limitTo: limitText }}
<a href="javascript:void(0)"
ng-hide="veryLongText.length < limitText"
ng-click="limitText = veryLongText.length + 1" > show more..
</a>
</p>
</div>
由于只在字符串长度超过限制时才需要省略号,因此使用ng-if添加省略号似乎比使用绑定更合适。
{{ longString | limitTo: 20 }}<span ng-if="longString.length > 20">…</span>