Привязка и область видимости элементов ng-repeat json

Я сделал приложение для еды на вынос, и я пытаюсь отправить результат, используя электронную почту mandrill. Я могу использовать форму ввода и отправлять электронные письма, однако я не могу привязывать и охватывать отфильтрованные результаты json ng-repeat на основе выбора пользователя. Соответствующий HTML ниже:

<md-card>
<md-card-content>
<h3 class="md-subhead" align="center">Review And Submit Order</h3>
<md-divider></md-divider>
<md-list ng-repeat="item in items.results | filter:true">
  <md-list-item layout="row">
    <h3><div style="text-align: left;" ng-bind-html="item.name"></div><span style="float: left;">Qty:{{item.qty}}</span></h3>
    <span flex></span>
    <h3>{{ item.price | currency }}</h3>
  </md-list-item>
  <md-list-item layout="row">
    <span>Side: {{item.type}}</span>
  </md-list-item>
  <md-list-item layout="row" ng-repeat="item in item.flavors | filter:true">
    <span>{{ item.name }}</span>
    <span flex></span>
    <span>{{ item.price | currency }}</span>
  </md-list-item>
  <md-list-item layout="row" ng-repeat="item in item.sizes | filter:true">
    <span>{{ item.name }}</span>
    <span flex></span>
    <span>{{ item.price | currency }}</span>
  </md-list-item>
</md-list>
<md-divider></md-divider>
<md-list>
  <md-list-item layout="row">
    <h3 class="md-subhead">Order Total:</h3>
    <span flex></span>
    <h3 ng-model="pricetotal">{{ total(items.results) | currency }}</h3>
  </md-list-item>
</md-list>
</md-card-content>
</md-card>
 <md-card ng-if="(items.results | filter : {active: true}).length > 0">
 <md-card-content layout-padding>

<form name="order">
 <md-input-container flex>
  <label>Name</label>
  <input ng-model="name">
 </md-input-container>
 <md-input-container flex>
     <label>Phone</label>
  <input ng-model="phone">
 </md-input-container>
  <md-input-container flex>
    <label>Address</label>
    <input ng-model="address">
  </md-input-container>
  <md-input-container flex>
    <label>Email</label>
    <input ng-model="email">
  </md-input-container>
  <md-input-container flex>
    <label>Options</label>
    <textarea ng-model="options" 
              columns="1" 
              md-maxlength="150"></textarea>
  </md-input-container>
</form>

 </md-card-content>
 <md-card-content layout="row" layout-align="end center">
  <md-button class="md-raised md-primary" ng-controller="EmailController" ng-click=sendMail()>
    Place Order
</md-button>

</md-card-content>
</md-card>

Итак, в основном, я хочу привязать $scope.menu к item.name с item.type, item.name в item.flavors и item.name в item.sizes отдельно и $scope.total к total(items.results) отдельно . Как только я привяжу эти значения, я хочу отправить их по электронной почте через Mandrill.

Вот мой EmailController:

app.controller('EmailController', function($scope, $http, $mdToast, OrderFunctions) {

  $scope.showSuccessToast = function() {
    $mdToast.show({
      position: "top",
      template: "<md-toast style='background-color:#3F51B5;'>Your order has been sent. Thank you!</md-toast>"
    });
  };
  $scope.showErrorToast = function() {
    $mdToast.show({
      position: "top",
      template: "<md-toast style='background-color:#3F51B5;'>Order not sent. Please check your internet connection.</md-toast>"
    });
  };

  $scope.total = OrderFunctions.total;
  $scope.totalOrder = OrderFunctions.totalOrder;

  $scope.sendMail = function() {
    var mailJSON = {
      "key": "XXXXXXXXXXXX", //your mandrill key goes here
      "message": {
      "html": "<h1>New Order</h1><p>You have received a new order from:</p><p>Name: *|NAME|*<br>Phone: *|PHONE|*<br>Address: *|ADDRESS|*<br>Email: *|EMAIL|*<br>Options: *|OPTIONS|*</p><p>They would like:</p><p>*|ITEMS|*</p><p>Order Total is: *|TOTAL|*</p>",
        "merge_vars": [{
          "rcpt": "[email protected]", //your email addy here
          "vars": [{
                        "name": "NAME",
                        "content": $scope.name
                    },{
                        "name": "PHONE",
                        "content": $scope.phone
                    },{
                        "name": "ADDRESS",
                        "content": $scope.address
                    },{
                        "name": "EMAIL",
                        "content": $scope.email
                    },{
                        "name": "OPTIONS",
                        "content": $scope.options
                    },{
                        "name": "ITEMS",
                        "content": $scope.menu
                    },{
                        "name": "TOTAL",
                        "content": "$"+$scope.total+".00"
          }]
        }],
        "text": "",
        "subject": "New Order Received", // change subject here
        "from_email": "[email protected]", //change from email here
        "from_name": "Signs Restaurant", //change from name here
        "to": [{
          "email": "[email protected]", //your email here
          "name": "New Order", //subject here
          "type": "to"
        }],
        "merge": true,
        "important": false,
        "track_opens": null,
        "track_clicks": null,
        "auto_text": null,
        "auto_html": null,
        "inline_css": null,
        "url_strip_qs": null,
        "preserve_recipients": null,
        "view_content_link": null,
        "tracking_domain": null,
        "signing_domain": null,
        "return_path_domain": null
      },
      "async": false,
      "ip_pool": "Main Pool"
    };
    var apiURL = "https://mandrillapp.com/api/1.0/messages/send.json";
    $http.post(apiURL, mailJSON).
    success(function(data, status, headers, config) {
      $scope.showSuccessToast();
      $scope.form = {}; //this clears the form after success
      console.log('successful email send.');
      console.log('status: ' + status);
      console.log('data: ' + data);
      console.log('headers: ' + headers);
      console.log('config: ' + config);
    }).error(function(data, status, headers, config) {
      $scope.showErrorToast();
      console.log('error sending email.');
      console.log('status: ' + status);
    });
    //use these to only clear certain fields  
    /*
    $scope.name = "";
    $scope.phone = "";
    $scope.address = "";
    $scope.email = "";
    $scope.clearCart();
    */
  };
});

Я пробовал следующее: я изменил это

    <md-list ng-repeat="item in items.results | filter:true">

to

    <md-list ng-repeat="item in (menu = items.results | filter:true)">

в этом случае, я думаю, мне придется определить $scope.menu, но это кажется слишком сложным, чтобы определить то же самое. Я был бы признателен за любые намеки на приближение к этому. Я довольно новичок в angularjs, но мне удалось выяснить большинство вещей. Идея состоит в том, чтобы получить отфильтрованные данные ng-repeat json с этой страницы и отправить их по электронной почте при нажатии кнопки «Разместить заказ». Заранее спасибо!

Вот плункер, над которым я работаю: http://plnkr.co/edit/4ByCDzXZfRU7kMX9oURT?p=preview Все JS находятся в index.html, EmailController начинается со строки 345. HTML находится в порядке.html

EDIT: Просто чтобы уточнить, моя проблема еще ниже из-за того, что у меня есть 2 функции ng-repeat одна под другой. Вот что я пробовал; мой измененный HTML:

<md-card>
<md-card-content>
<h3 class="md-subhead" align="center">Review And Submit Order</h3>
<md-divider></md-divider>
<md-list ng-repeat="item in filteredmenu = (items.results | filter:true)">
  <md-list-item layout="row">
    <h3><div style="text-align: left;" ng-bind-html="item.name"></div><span style="float: left;">Qty:{{item.qty}}</span></h3>
    <span flex></span>
    <h3>{{ item.price | currency }}</h3>
  </md-list-item>
  <md-list-item layout="row">
    <span>Side: {{item.type}}</span>
  </md-list-item>
  <md-list-item layout="row" ng-repeat="item in filteredflavors = (item.flavors | filter:true)">
    <span>{{ item.name }}</span>
    <span flex></span>
    <span>{{ item.price | currency }}</span>
  </md-list-item>
  <md-list-item layout="row" ng-repeat="item in filteredsizes = (item.sizes | filter:true)">
    <span>{{ item.name }}</span>
    <span flex></span>
    <span>{{ item.price | currency }}</span>
  </md-list-item>
</md-list>
<md-divider></md-divider>
<md-list>
  <md-list-item layout="row">
    <h3 class="md-subhead">Order Total:</h3>
    <span flex></span>
    <h3 ng-model="pricetotal">{{ pricetotal=(total(items.results) | currency) }}</h3>
  </md-list-item>
</md-list>
</md-card-content>
</md-card>
 <md-card ng-if="(items.results | filter : {active: true}).length > 0">
 <md-card-content layout-padding>

<form name="order">
 <md-input-container flex>
  <label>Name</label>
  <input ng-model="name">
 </md-input-container>
 <md-input-container flex>
     <label>Phone</label>
  <input ng-model="phone">
 </md-input-container>
  <md-input-container flex>
    <label>Address</label>
    <input ng-model="address">
  </md-input-container>
  <md-input-container flex>
    <label>Email</label>
    <input ng-model="email">
  </md-input-container>
  <md-input-container flex>
    <label>Options</label>
    <textarea ng-model="options" 
              columns="1" 
              md-maxlength="150"></textarea>
  </md-input-container>
</form>

 </md-card-content>
 <md-card-content layout="row" layout-align="end center">
  <md-button class="md-raised md-primary" ng-controller="EmailController" ng-click=sendMail()>
    Place Order
</md-button>

</md-card-content>
</md-card>

Я добавил этот скрипт в свой контроллер электронной почты:

  $scope.filteredmenu = function (filteredmenu){
    var order = " ";
  angular.forEach(filteredmenu, function(item) {
    var flavor = " ";
    var size = " ";
    order += item.name + ", Qty: " + item.qty + " , ";
    angular.forEach(filteredflavors, function(option) {
      flavor += "Flavor: " + option.name + " , ";
    });
    angular.forEach(filteredsizes, function(option) {
      size += "Size: " + option.name + " , ";
    });
    menuorder += order + size + flavor;
  });
  return menuorder;
  };

Я могу получить результат для $scope.pricetotal, но не для $scope.filteredmenu; Что я делаю не так?