는 더 많은 텍스트를보기 : 응답이 JSON의 형태로 오는

Question

안녕 내가 을 일부 텍스트 (3 선)을 표시해야하고 다른 텍스트 더보기 버튼 여기

텍스트가 JSON

에서 오는에로드한다

JS :

$scope.fnInit = function() { 
     getInfo.getSubCategory($stateParams.id).then(function(response){ 
      $scope.subCategory=response; 
     }) 
    }; 

HTML : 설명 초에서

<div ng-repeat="data in subCategory" class="sub_category"> 
    <div class="header"><b>{{data.heading}}</b></div> 
    <div class="row content"> 
     <div class="col-xs-4"><img ng-src="{{data.image}}" class="img-responsive center-block" ></div> 
     <div class="description col-xs-7" ng-bind-html="data.description"></div> 
    </div> 
</div> 

나는 제한된 텍스트를 필요로하고 그때 ... 내가 클릭 할 때 ... 나는 전체 데이터를 얻을 필요가있다.

어떤 도움

을 감상 할 수있다

Answer 1

당신은 다음과 같이 표시 할 문자의 수를 제한하여 시작할 수 있습니다

:

$scope.limit = 100; 

$scope.data = [{ 
    'description': 'Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. ' 
    }]; 

$scope.showMore = function(desc) { 
    console.log(desc); 
    $scope.limit = desc.length  
} 

당신을 기반으로 텍스트의 첫 세 줄을 충당하기 위해 limit을 설정할 수 있습니다 <div> 크기입니다.

$scope.showMore = function(desc) { 
    $scope.limit = desc.length; 
} 

plunkr를 참조하십시오 더 많은 텍스트를 표시하는 컨트롤러에

<span ng-click='showMore(d.description)'>...</span> 

와 논리 :

이 좀 더 때문에 같은 텍스트를 표시하기 위해 (...) 3 점으로 <span> 추가 상세 사항은.

this one처럼 사용할 수있는 맞춤 필터가 있습니다.

SO this answer은 단어를 어기는 일없이 맞춤 필터를 구현하는 방법을 보여줍니다.