AngularJS Live Example

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div ng-controller = "myCtrl1"> 
<ul data-ng-init="data.showIataList = false">
  {{data.showIataList}} 
  <li data-ng-repeat="value in data.departureIataList">
    <a href="javascript:"
       data-ng-if="$index < 3 || showIataList">
       {{value}}
    </a>
    {{showIataList}}
    <a href="javascript:"
       data-ng-if="!data.showIataList && $index == 3"
       data-ng-click="data.showIataList = true">
        xxxx:{{data.showIataList}} 
    </a>
  </li>
</ul>



</div>

JavaScript

var myApp = angular.module('myModule', []);

myApp.controller('myCtrl1', ['$scope', function($scope) {
    $scope.data = {};
    $scope.data.departureIataList=
        [{name:"name_1"},{name:"name_2"},{name:"name_3"},{name:"name_4"},{name:"name_5"},
         {name:"name_6"},{name:"name_7"},{name:"name_8"},{name:"name_9"},{name:"name_10"}];
    
   // $scope.data.showIataList = false;
   
}]);