AngularJS: How to only show items in json file that have a certain value(s) based on a nested array of a variable

Please note: This is my first angular application so I apologize if I'm asking a wrong or silly question.

I'm using ng-repeat to list data items present in a json file. I want to be able to list only the data (ng-show) necessary for different partials of a SPA. The site is a personal website for family recipes. Upon a button click I want to be able to only list dessert foods, etc. I already have this working, but I'm using multiple json files with duplicated data to accomplish this (dirty data?). The goal is to have only one json file for the whole site.

Here is an example of one variable or "dish" in the data set:

{
    "name": "Pecan Pie",
    "shortname": "pecan-pie",
    "type": [
        "dessert",
        "holidaydish"
    ],
    "contributor": "Mark",
    "totalt": "1h 5m",
    "ingredients": "1 cup light brown sugar",
    "steps": "Preheat oven to 400 degrees.",
},

I'm trying to show data based on the nested array for the value: "type"

HTML in partials calling each variable in the json file:

(This is where I have been failing to use ng-show to show only the variables or "dishes" that have dessert / etc. in the nested type array)

<li class="dishlistli" ng-repeat="item in dish | filter: query | orderBy: dishOrder:direction">
  <a href="#/allcards/{{dish.indexOf(item)}}">
    <div>
      <h2>{{item.name}}</h2></div>
  </a>
</li>

Ex Controller for a partial:

dishControllers.controller('AllcardsController', ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams) {
  $http.get('js/all.json').success(function(data) {
    $scope.IsVisible = false;
    $scope.ShowHide = function() {
      $scope.IsVisible = $scope.IsVisible ? false : true;
    }

    $scope.dish = data;
    $scope.whichItem = $routeParams.itemId;

    if ($routeParams.itemId > 0) {
      $scope.prevItem = Number($routeParams.itemId) - 1;
    } else {
      $scope.prevItem = $scope.dish.length - 1;
    }

    if ($routeParams.itemId < $scope.dish.length - 1) {
      $scope.nextItem = Number($routeParams.itemId) + 1;
    } else {
      $scope.nextItem = 0;
    }
  });
}]);

Any time and help with this is greatly appreciated. Let me know if I'm missing any necessary information.

The working version of the app (using multiple json files) is at: http://clarkecookbook.com/#/all

I can always continue to use the multiple json files, but I would like to know how to do this right.

<li class="dishlistli" ng-repeat="item in dish | filter: query | orderBy: dishOrder:direction" ng-if="showDelete(item.type)">

Using the above ng-if directive along with adding the below function to the controller enabled me to only display the desired data items based on the type variable.

$scope.showDelete = function(itemType){
    var testType = "drink";

    if(testType.indexOf(itemType) > -1){ //test the Type
        return true;
    }
    return false;
}