angularProject/app/views/selected-meals.html

<div class="selected-meals" ng-controller="SelectMenuPageController">
  <h2>Breakfast</h2>
  <div  ng-repeat="meal in meals">
      <p ng-if="meal.type == 'breakfast' && meal.isSelected == true">{{meal.mealName}} | {{meal.isSelected}}
        <button type="button" name="button" ng-click="deleteMeal($index)">Delete</button>
      </p>
  </div>
  <hr>
  <h2>Lunch</h2>
  <div  ng-repeat="meal in meals">
      <p ng-if="meal.type == 'lunch' && meal.isSelected == true">{{meal.mealName}} | {{meal.isSelected}}
        <button type="button" name="button" ng-click="deleteMeal($index)">Delete</button>
      </p>
  </div>
  <hr>
  <h2>Dinner</h2>
  <div  ng-repeat="meal in meals">
      <p ng-if="meal.type == 'dinner' && meal.isSelected == true">{{meal.mealName}} | {{meal.isSelected}}
        <button type="button" name="button" ng-click="deleteMeal($index)">Delete</button>
      </p>
  </div>
  <hr>
  <h2>Snacks</h2>
  <div  ng-repeat="meal in meals">
      <p ng-if="meal.type == 'snacks' && meal.isSelected == true">{{meal.mealName}} | {{meal.isSelected}}
        <button type="button" name="button" ng-click="deleteMeal($index)">Delete</button>
      </p>
  </div>
</div>