Updating data in a service [Angular.JS]

Question

JavaScript

Good afternoon.

There is a controller that works with the model, the model is quite voluminous.

function FooCtrl($scope, service) {
   $scope.foo1 = null;
   $scope.foo2 = null;
   $scope.foo3 = null;
  ............................
  $scope.fooN = null;
}

angular.module('myService', []).
   factory('service', function () {
     var foo1 = 'abc';
     ...........
   })

When the data is updated, that is, a person, for example, enters data into the input, and decides to go to another page, you need to save the state between pages, for this the service was chosen.

Now the question is: how to update them so as not to hang $watch on each variable? You can, of course, hang $watch on the entire $scope, and update the entire model, but is this the best solution?
Please advise.

Answer 1

You are using $scope as a model, which is wrong. The model must be an object inside $scope.
If you use the service as a global object, use it inside the controller in templates. Make $scope.Model = service.Model and you can use it as Model.foo1 in templates.