Я пытаюсь сохранить данные из формы, которая находится в модальном, для локального хранилища. Но по какой-то причине данные становятся пустыми.

Например, когда я получаю данные, он возвращает это:

,,,

вместо этого:

Имя, адрес электронной почты, год, майор, телефон #

Таким образом, похоже, что он сохраняет пустую запись. Я очень новичок в AngularJS, поэтому не могу понять, как это исправить. Если бы кто-нибудь мог мне помочь, это было бы потрясающе!

controllers.js

angular.module('starter.controllers', [])

.controller('AppController',['$scope', 'getLocalStorage', '$ionicModal', function ($scope, getLocalStorage, $ionicModal) {
    $scope.todos = getLocalStorage.getTodos();

    $scope.clearSelected = function () {
        $scope.todos = $scope.todos.filter(function (item) {
            return !item.selected;
        });
        getLocalStorage.updateTodos($scope.todos);

    };

    $ionicModal.fromTemplateUrl('modal.html', function(modal) {
        $scope.modal = modal;
      }, {
        animation: 'slide-in-up',
        focusFirstInput: true
      });
}])

.controller('ModalCtrl', ['$scope', 'getLocalStorage', function ($scope, getLocalStorage) {

  $scope.todos = getLocalStorage.getTodos();

  $scope.addTodo = function () {
      $scope.todos.push(
        {'name': $scope.name,
         'email': $scope.email,
         'year': $scope.year,
         'major': $scope.major,
         'phone': $scope.phone,
         'selected': false});
      $scope.modal.hide();
      getLocalStorage.updateTodos($scope.todos);
  };
}])

.controller('InfoCtrl', ['$scope', 'getLocalStorage', function ($scope, getLocalStorage) {
    $scope.todos = getLocalStorage.getTodos();
}
]);

services.js

angular.module('starter.services', [])

var storageService = angular.module('storageService', []);

storageService.factory('getLocalStorage', function () {

    var todoList = {};

    return {
            list: todoList,

        updateTodos: function (todosArr) {
            if (window.localStorage && todosArr) {
                localStorage.setItem("todos", angular.toJson(todosArr));
            }
            //update the cached version
            todoList = todosArr;
        },

        getTodos: function () {
            todoList = angular.fromJson( localStorage.getItem("todos") );
            return todoList ? todoList : [];
        }
    };

})

HTML

<ion-view view-title="TechProf">
  <ion-content>
  <button class="button button-full button-positive" ng-click="modal.show()">OPen Modal</button>

      <ion-list>
          <h3>List</h3>
        <ul class="list">
           <li ng-repeat="s in todos" class="item">
               <input ng-model="s.selected" type="checkbox" />
               <span ng-class="{'selected': todo.selected}">{{ s.name }}, {{ s.email }}, {{ s.year }},{{ s.major }}, {{ s.phone }}</span>
           </li>
        </ul>
        <button class="button button-full button-positive" ng-click="clearSelected()">Delete Selected</button>
    </ion-list>
  </ion-content>
  <script id="modal.html" type="text/ng-template">
        <div class="modal" ng-controller="ModalCtrl">
          <header class="bar bar-header bar-positive">
            <h1 class="title">New Contact</h1>
            <button class="button button-clear button-primary" ng-click="modal.hide()">Cancel</button>
          </header>
          <ion-content has-header="true">
          <form name="frm" ng-submit="addTodo()">
          <div class="list">
            <label class="item item-input">
              <input type="text" placeholder="Name" ng-model="name" required>
            </label>
            <label class="item item-input">
              <input type="email" placeholder="Email" ng-model="email" required>
            </label>
            <label class="item item-input item-select">
            <div class="input-label">Year</div>
            <select ng-model="year" required>
              <option selected>Freshman</option>
              <option >Sophmore</option>
              <option>Junior</option>
              <option>Senior</option>
            </select>
            </label>
            <label class="item item-input">
              <input type="text" placeholder="Major" ng-model="major" required>
            </label>
            <label class="item item-input">
              <input type="number" placeholder="Phone" ng-model="phone" ng-minlength="10" required>
            </label>
            <button class="button button-full button-positive" ng-disabled="frm.$invaild">Submit</button>
            </div>
          </form>
          </ion-content>
        </div>
      </script>
</ion-view>