我有以下几点:
<div>{{modal.title}}</div>
有没有一种方法可以限制字符串的长度,比如20个字符?
一个更好的问题是,有没有一种方法可以将字符串更改为截断并显示。如果超过20个字符?
我有以下几点:
<div>{{modal.title}}</div>
有没有一种方法可以限制字符串的长度,比如20个字符?
一个更好的问题是,有没有一种方法可以将字符串更改为截断并显示。如果超过20个字符?
当前回答
如果你有两个绑定{{item.name}}和{{item.directory}}。
并且希望将数据显示为一个后跟名称的目录,假设目录为“/root”,名称为“Machine”(/root- Machine)。
{{[item.directory]+[isLast ? '': '/'] + [ item.name] | limitTo:5}}
其他回答
我发现最简单的解决方案是让材料设计(1.0.0-rc4)来做这项工作。md-input-container将为您完成这项工作。它连接了字符串,添加了省略,它还有一个额外的好处,允许你点击它来获得全文,所以它是整个玉米卷饼。您可能需要设置md-input-container的宽度。
HTML:
<md-input-container>
<md-select id="concat-title" placeholder="{{mytext}}" ng-model="mytext" aria-label="label">
<md-option ng-selected="mytext" >{{mytext}}
</md-option>
</md-select>
</md-input-container>
CS:
#concat-title .md-select-value .md-select-icon{
display: none; //if you want to show chevron remove this
}
#concat-title .md-select-value{
border-bottom: none; //if you want to show underline remove this
}
我知道这有点晚了,但在angularjs的最新版本(我使用的是1.2.16)中,limitTo过滤器支持字符串和数组,所以你可以像这样限制字符串的长度:
{{ "My String Is Too Long" | limitTo: 9 }}
它将输出:
My String
Use this in your html - {{value | limitTocustom:30 }}
and write this custom filter in your angular file,
app.filter('limitTocustom', function() {
'use strict';
return function(input, limit) {
if (input) {
if (limit > input.length) {
return input.slice(0, limit);
} else {
return input.slice(0, limit) + '...';
}
}
};
});
// if you initiate app name by variable app. eg: var app = angular.module('appname',[])
对我来说还行 'In span', ng-show = "MyCtrl.value.$viewValue. "长度> your_limit"…阅读更多。“结束时间”
下面是一个用于截断文本的自定义过滤器。它的灵感来自于EpokK的解决方案,但根据我的需求和口味进行了修改。
angular.module('app').filter('truncate', function () {
return function (content, maxCharacters) {
if (content == null) return "";
content = "" + content;
content = content.trim();
if (content.length <= maxCharacters) return content;
content = content.substring(0, maxCharacters);
var lastSpace = content.lastIndexOf(" ");
if (lastSpace > -1) content = content.substr(0, lastSpace);
return content + '...';
};
});
这里是单元测试,所以你可以看到它应该如何表现:
describe('truncate filter', function () {
var truncate,
unfiltered = " one two three four ";
beforeEach(function () {
module('app');
inject(function ($filter) {
truncate = $filter('truncate');
});
});
it('should be defined', function () {
expect(truncate).to.be.ok;
});
it('should return an object', function () {
expect(truncate(unfiltered, 0)).to.be.ok;
});
it('should remove leading and trailing whitespace', function () {
expect(truncate(unfiltered, 100)).to.equal("one two three four");
});
it('should truncate to length and add an ellipsis', function () {
expect(truncate(unfiltered, 3)).to.equal("one...");
});
it('should round to word boundaries', function () {
expect(truncate(unfiltered, 10)).to.equal("one two...");
});
it('should split a word to avoid returning an empty string', function () {
expect(truncate(unfiltered, 2)).to.equal("on...");
});
it('should tolerate non string inputs', function () {
expect(truncate(434578932, 4)).to.equal("4345...");
});
it('should tolerate falsey inputs', function () {
expect(truncate(0, 4)).to.equal("0");
expect(truncate(false, 4)).to.equal("fals...");
});
});