Angular ng-repeat inside nav tab not working - angularjs

Question

I'm trying to generate a nav tab dynamically.
This code works:
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" ng-class="{active:isSelected(1)}">
<a ng-click="select(1)" aria-controls="all menu"role="tab">The Menu</a></li>
<li role="presentation" ng-class="{active:isSelected(2)}">
<a ng-click="select(2)" aria-controls="appetizers" role="tab">Appetizers</a></li>
<li role="presentation" ng-class="{active:isSelected(3)}">
<a ng-click="select(3)" aria-controls="mains" role="tab">Mains</a></li>
<li role="presentation" ng-class="{active:isSelected(4)}">
<a ng-click="select(4)" aria-controls="desserts" role="tab">Desserts</a></li>
</ul>
<div class="tab-content">
<ul class="media-list tab-pane fade in active">
<li class="media" ng-repeat="dish in dishes | filter:filtText">
<div class="media-left media-middle">
<a ui-sref="app.dishdetails({id: dish._id})">
<img class="media-object img-thumbnail"
ng-src={{dish.image}} alt="Uthappizza">
</a>
</div>
<div class="media-body">
<h2 class="media-heading">{{dish.name}}
<span class="label label-danger label-xs">{{dish.label}}</span>
<span class="badge">{{dish.price/100 | currency}}</span></h2>
<p ng-show="showDetails">{{dish.description}}</p>
<button ng-show="showFavorites" ng-click="addToFavorites(dish._id)" class="btn btn-xs btn-default pull-right"
type="button">
<i class="fa fa-heart"></i>
</button>
</div>
</li>
</ul>
</div>
Follow the jscode in Menucontroller:
menuFactory.query(
function (response) {
$scope.dishes = response;
$scope.showMenu = true;
},
function (response) {
$scope.message = "Error: " + response.status + " " + response.statusText;
});
$scope.select = function (setTab) {
$scope.tab = setTab;
if (setTab === 2) {
$scope.filtText = "appetizer";
} else if (setTab === 3) {
$scope.filtText = "mains";
} else if (setTab === 4) {
$scope.filtText = "dessert";
} else {
$scope.filtText = "";
}
};
$scope.isSelected = function (checkTab) {
return ($scope.tab === checkTab);
};
Here the code with ng-repeat:
<ul class="nav nav-tabs" role="tablist">
<li ng-repeat="category in categories" role="presentation" ng-class="{active:isSelected(category)}">
<a ng-click="select(category)" aria-controls="category" role="tab">{{category}}</a>
</li>
</ul>
Here new jscode in the controller:
$scope.categories = ["all menu","appetizers","mains","desserts"];
$scope.select = function (setTab) {
$scope.tab = setTab;
if (setTab === "all menu") {
$scope.filtText = "";
} else {
$scope.filtText = setTab;
}
};
$scope.isSelected = function (category){
$scope.currentCategory = category;
};
When I tried with ng-repeat the links in the nav don't work. Previously, I've forgot to replace numbers for strings ( $scope.isSelected = function (checkTab) {return ($scope.tab === checkTab);}; The function select is now calling.
I'd like to put the items in an array and generate the nav dynamically from a list of categories. Finally I replace $scope.filtText = "setTab" to $scope.filtText = setTab and now filtText is working correcty.
Thanks!!