首頁(yè) 猿問 angularjs如何在ng-re...

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

JavaScript

繁星點(diǎn)點(diǎn)滴滴 2019-04-19 15:59:18

數(shù)據(jù)存在一個(gè)數(shù)組里面，需要把這些數(shù)據(jù)顯示到HTML頁(yè)面上，目前是通過ng-repeat方式來(lái)顯示。但是數(shù)組中title這一項(xiàng)的字符長(zhǎng)度比較長(zhǎng)，所以想要限制一下這段字符在HTML頁(yè)面上顯示時(shí)，超過指定的長(zhǎng)度后面的內(nèi)容就會(huì)以省略號(hào)的形式顯示。請(qǐng)問要怎么樣實(shí)現(xiàn)？html頁(yè)面：{{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 回答

人到中年有點(diǎn)甜

TA貢獻(xiàn)1895條經(jīng)驗(yàn) 獲得超7個(gè)贊

轉(zhuǎn)貼自filter-LimitthelengthofastringwithAngularJS-StackOverflow寫一個(gè)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，只切單字。長(zhǎng)度(整數(shù))-要保留的最大字?jǐn)?shù)。後輟(字串，默認(rèn)：'…')-接在字詞的後面。或者直接用別人寫好的：angular-truncate演示