数据存在一个数组里面，需要把这些数据显示到HTML页面上，目前是通过ng-repeat方式来显示。但是数组中title这一项的字符长度比较长，所以想要限制一下这段字符在HTML页面上显示时，超过指定的长度后面的内容就会以省略号的形式显示。请问要怎么样实现？

html页面：

    
 
      
     
{ {x.title}}
 
     
{ {x.cost}}
 
    

数据格式如下：

$scope.TU = [{    "tuid":"xy0001",    "imgurl":"img/178.jpg", "title":"哈哈哈哈哈哈哈哈哈", "cost":"86" }, { "tuid":"xy0002", "imgurl":"img/178.jpg", "title":"呵呵呵呵呵呵呵呵呵呵呵呵", "cost":"96" }, { "tuid":"xy0003", "imgurl":"img/178.jpg", "title":"嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿", "cost":"89" } ]

寫一個 filter：

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) { value = value.substr(0, lastspace); } } return value + (tail || ' …'); }; });

使用方式：

{

{some_text | cut:true:100:' ...'}}

參數:

切字方式 (布林) - 如果是 true，只切單字。

長度 (整數) - 要保留的最大字數。

後輟 (字串，默认：'…') - 接在字詞的後面。

 

或者直接用別人寫好的： 

 

官方有 api 

例子 html 模板中：

Output numbers: {

{ numbers | limitTo:numLimit }}