You can’t use ng-model on a button. It only works on elements that accept a user input.

What you can do is this:

<div class="row">
  <button class="btn btn-success col-3" ng-repeat="i in Items" ng-click="addOrderToList(i)">{{i.itemName}}</button> 
</div>

Then change the addOrderToList function to:

 $scope.addOrderToList = function (item) {
     $scope.itemOrderList.push(item);
 };

Show the itemName in your itemOrderList ng-repeat loop with {{i.itemName}} wherever you want it.

I am creating a restaurant menu app that a waiter could use to input orders.

I have buttons labeled with different food names being created by ng-repeat that has a model that is pulled from back end and database. I want to be able to click a button, lets say the one that says “Hot Dog”… Add that to my itemOrderList array in my AngularJs code and for that same arrays contents to be displayed on my front end UI as “Chosen items for the order”. I am able to get a list of items to pop up with remove buttons near them every time I select a food item button. However, the name of the food item is not near the remove button it is just blank. I’m not sure what model to give the food buttons in order for my addOrderToList function in my AngularJs code to know what value to store in the itemOrderList Array.

JS code

.controller('orderAddCtrl', ['$scope', '$location', 'dataService', function ($scope, $location, dataService) {

            $scope.itemOrderList = [];

            $scope.addOrderToList = function () {
                $scope.itemOrderList.push($scope.whatDoIPutHere?);
                $scope.input = '';
            };

            $scope.removeFromOrderToList = function (index) {
                $scope.itemOrderList.splice(index, 1);
            };

Html

<div class="row">
        <div class="card col-8">
            <h2>Food Items</h2>
            <div class="row">
                <button class="btn btn-success col-3" ng-repeat="i in Items" ng-model="whatDoIPutHere?" ng-click="addOrderToList()">{{i.itemName}}</button>
            </div>
        </div>

        <div class="col-4">
            <div class="form-group">
                <label class="control-label">Customer Name</label>
                <div class="col-lg-10">
                    <input type="text" class="form-control" ng-model="order.customerName" />
                </div>
            </div>

            <div class="card col-4"">
                <h2>Order Items</h2>
                <ul>
                    <li ng-repeat="i in itemOrderList track by $index">
                        <button ng-click="removeFromOrderToList($index)">Remove</button>
                    </li>
                </ul>
            </div>