angular ng repeat disable all items except first item

Question

I have a list of items. Each item is in div. i want to show only first item enable except others shows disabled.

AngularJs

angular.module('example', [])
.controller('myCtrl', function Ctrl($scope) {
    $scope.items = [1,2,3];
});

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="example" ng-controller="myCtrl">
   <div ng-repeat="item in items">{{item}}</div>
</div>

Answer 1

simply by using $first attribute:

<div ng-app="example" ng-controller="myCtrl">
     <div ng-repeat="item in items" ng-disabled="!$first">{{item}}</div>
 </div>

beware: ng-disabled works with form elements. see documentation for details.

Answer 2

you can do this using $first.

 angular.module('example', [])
    .controller('myCtrl', function Ctrl($scope) {
    $scope.items = [1,2,3];
      });

    

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

    <div ng-app="example" ng-controller="myCtrl">
         <div ng-repeat="item in items"><span ng-if="$first">{{item}}</span>
<span ng-if="!$first">do whatever you want with this item {{item}} </span>
</div>
</div>