title: Angular JS - Having an empty array
body: <p>I have a form that submits data into a function called <code>ng-submit="newBirthday()</code> this pushes data -    <code>$scope.bdayname, $scope.bdaydate;</code> into an array called <code>bdaes</code> </p>
  
  <p>My issue is that with all of the tutorials I have seen the array has predefined data is there a way that it can be an empty array that gets filled with data when it is submitted?</p>
  
  <p><strong>app.js:</strong></p>
  
  <pre><code>var app = angular.module('birthdayToDo', []);
  
  app.controller('main', function($scope){ 
  
      // Start as not visible but when button is tapped it will show as true 
  
          $scope.visible = false;
  
      // Create the array to hold the list of Birthdays
  
          $scope.bdays = [{}];
  
      // Create the function to push the data into the "bdays" array
  
      $scope.newBirthday = function(){
  
          $scope.bdays.push({name:$scope.bdayname, date:$scope.bdaydate});
  
          $scope.bdayname = '';
          $scope.bdaydate = '';
  
      }
  });
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;body ng-app="birthdayToDo" ng-controller="main"&gt;
      &lt;div id="wrap"&gt;
  
        &lt;!-- Begin page content --&gt;
        &lt;div class="container"&gt;
          &lt;div class="page-header"&gt;
            &lt;h1&gt;Birthday Reminders&lt;/h1&gt;
          &lt;/div&gt;
              &lt;ul ng-repeat="bdays in bdays"&gt;
                  &lt;li&gt;{{bdae.name}} | {{bdae.date}}&lt;/li&gt;
              &lt;/ul&gt;
  
             &lt;form ng-show="visible" ng-submit="newBirthday()"&gt;
              &lt;label&gt;Name:&lt;/label&gt;
              &lt;input type="text" ng-model="bdayname" placeholder="Name"/&gt;
              &lt;label&gt;Date:&lt;/label&gt;
              &lt;input type="date" ng-model="bdaydate" placeholder="Date"/&gt;
              &lt;button class="btn" type="submit"&gt;Save&lt;/button&gt;
          &lt;/form&gt;
        &lt;/div&gt;
  
        &lt;div id="push"&gt;&lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div id="footer"&gt;
        &lt;div class="container"&gt;
          &lt;a class="btn" ng-click="visible = true"&gt;&lt;i class="icon-plus"&gt;&lt;/i&gt;Add&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;
          &lt;script type="text/javascript" src="js/cordova-2.5.0.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
              app.initialize();
          &lt;/script&gt;
      &lt;/body&gt;
  </code></pre>