In the Angulyar style guide from Tod Motto, there is an example of using the service in the "Presentational logic only (MVVM)" controller:

// recommended function MainCtrl (UserService) { var vm = this; UserService .getUsers() .then(function (response) { vm.users = response; }); vm.removeUser = function (user, index) { UserService .removeUser(user) .then(function (response) { vm.users.splice(index, 1); }); }; }

I have long suspected that I am doing something extremely not fashionable, because my factories are so autonomous that the controller is almost out of work. I use factories like this:

 function UserService () { var api = { loaded: false getData: getData } return api; function getData() { // Получение данных api.loaded = true; } } function MainCtrl (UserService) { var vm = this; vm.userService = UserService; // Использую api фабрики в контроллере, если нужно получить некие входные данные UserService.getData() }

Then I work with the factory directly in the template, calling the necessary methods in the directives (ng-click, ng-mouseover, ng-hide, ...) That is, it turns out simply to forward the factory in view through the controller.

Help cultivate logic in the brain according to which you need to separate the work of the factory from the work of the controller.

  • for example testing - Grundy

2 answers 2

I will try to explain:

Controllers are designed to handle events from the user ( ng-click , ng-change , and other ng directives, the entire list is here ).
Factories or services are singletones (and how do they differ in reading here ), which are designed to obtain the necessary data from the database and cookies, or we ourselves can store the necessary data in them, so that we can use them at our discretion.

Angulyar is an MVW ( Model-View-Whatever ) framework, which means that we can use both MVC and MVVM patterns ( article ). But the structure of the work will be explained in MVC.

Basic layout:
The controller receives the event from the user, then takes us the necessary data from the Factory , stores all this data in the $ scope of the controller, and then displays all this in the View .

  • It does not look like a complete explanation :) "Controllers are designed to handle user events" - this is only a small fraction of what controllers can do. "and how do they differ in reading here" - I did not ask about it) "takes us the necessary data from the Factory, saves all this data in the $ scope of the controller" - this is a big mistake - to save all the data from the factory in $ scope. Only what should be updated in the cache is stored in the skop, otherwise the digest-cycle will explode with a large amount of data. As a rule, data store this controller. - Harvey
  • @Harvey, Only what needs to be updated in the cache is stored in the skop - you are wrong. There is no connection between what is stored in the osprey and what will be checked by the observer. As a rule, data store this controller. - the link to which when using controllerAs syntax is also placed in the skop - Grundy
  • @Grundy, I agree, missed. - Harvey

The controller is placed the logic of the piece of the application that applies only to this controller.
Methods are placed in the service factory , data that does not contain logic, but returns approximately always the same data and can be used (called) in any part of the application.
Usually the service is injected into the controller,

  1. from the service get the necessary data
  2. depending on the approach adopted in the application, these data are recorded either in the in-st scop or in the st-in in the controller (Controller As syntax).
  3. And only then can they be accessed from the template.