首頁猿問 angularjs如何在ng-re...

angularjs如何在ng-repeat過程中控制字符串長度超過指定長度后面內(nèi)容以省略號顯示

JavaScript

慕虎7371278 2019-04-10 20:47:42

數(shù)據(jù)存在一個數(shù)組里面，需要把這些數(shù)據(jù)顯示到HTML頁面上，目前是通過ng-repeat方式來顯示。但是數(shù)組中title這一項的字符長度比較長，所以想要限制一下這段字符在HTML頁面上顯示時，超過指定的長度后面的內(nèi)容就會以省略號的形式顯示。請問要怎么樣實現(xiàn)？html頁面：{{x.title}}{{x.cost}}數(shù)據(jù)格式如下：$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"}]

查看完整描述

2 回答

qq_花開花謝_0

TA貢獻1835條經(jīng)驗獲得超7個贊

轉(zhuǎn)貼自filter-LimitthelengthofastringwithAngularJS-StackOverflow寫一個filter：jsangular.module('ng').filter('cut',function(){returnfunction(value,wordwise,max,tail){if(!value)return'';max=parseInt(max,10);if(!max)returnvalue;if(value.length<=max)returnvalue;value=value.substr(0,max);if(wordwise){varlastspace=value.lastIndexOf('');if(lastspace!=-1){value=value.substr(0,lastspace);}}returnvalue+(tail||'…');};});使用方式：{{some_text|cut:true:100:'...'}}參數(shù):切字方式(布林)-如果是true，只切單字。長度(整數(shù))-要保留的最大字數(shù)。後輟(字串，默認：'…')-接在字詞的後面。或者直接用別人寫好的：angular-truncate演示