I have a form that submits data into a function called ng-submit="newBirthday() this pushes data - $scope.bdayname, $scope.bdaydate; into an array called bdaes
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?
app.js:
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 = ''; } }); HTML:
<body ng-app="birthdayToDo" ng-controller="main"> <div id="wrap"> <!-- Begin page content --> <div class="container"> <div class="page-header"> <h1>Birthday Reminders</h1> </div> <ul ng-repeat="bdays in bdays"> <li>{{bdae.name}} | {{bdae.date}}</li> </ul> <form ng-show="visible" ng-submit="newBirthday()"> <label>Name:</label> <input type="text" ng-model="bdayname" placeholder="Name"/> <label>Date:</label> <input type="date" ng-model="bdaydate" placeholder="Date"/> <button class="btn" type="submit">Save</button> </form> </div> <div id="push"></div> </div> <div id="footer"> <div class="container"> <a class="btn" ng-click="visible = true"><i class="icon-plus"></i>Add</a> </div> </div> <script type="text/javascript" src="js/cordova-2.5.0.js"></script> <script type="text/javascript"> app.initialize(); </script> </body> 
bdaevsbdayis a little confusing. Also, your array isn't empty - it has one empty object in it. An empty array is simple$scope.bdays = [];. If you post a Plunker, I'll be able to sort it out.