angularjs

angularjs template

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.8/angular-filter.min.js"></script>
<div ng-app="myApp" ng-controller="MainCtrl">
array  [{t:'abc',i:1},
    {t:'ghj',i:2},
    {t:'rty',i:3},
    {t:'qwe',i:4}]
    where property i is smaller than 3 <br/><br/>
        <div ng-repeat="item in myarr">
             
             <ng-container ng-if="(myarr.indexOf(item) < breakVar)">
                  {{item.t + ' ' + item.i}} 
             </ng-container>
             kk
        </div>
</div>

JavaScript

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

 app.controller('MainCtrl', function($scope) {
		$scope.myarr = [{t:'abc',i:1},
    {t:'ghj',i:2},
    {t:'rty',i:3},
    {t:'qwe',i:4}];
  $scope.breakVar = $scope.myarr.map(function(x) {return x.i;}).indexOf(3);
 });