Controller and service logic with Angularjs

Question

I have some questions regarding the logic of the controller and service search functions.

Follow an example of service:

angular.module("myApp").factory("ProjetosAPI", function ($http, config) {

    var _getProjetos = function (pagina, total) {
        return $http.get(config.baseUrl + "/projetos?pagina=" + pagina + "&total=" + total);
    };

    var _getProjetosPorEmpresa = function (pagina, total, empresa) {
        return $http.get(config.baseUrl + "/projetos?pagina=" + pagina + "&total=" + total + "&empresa=" + empresa);
    };

    var _getProjetosPorEmpresaData = function (pagina, total, empresa, data) {
        return $http.get(config.baseUrl + "/projetos?pagina=" + pagina + "&total=" + total + "&empresa=" + empresa + "&data=" + data);
    };

    return {
        getProjetos: _getProjetos,
        getProjetosPorEmpresa: _getProjetosPoEmpresa,
        getProjetosPorEmpresaData: _getProjetosPoEmpresaData
    };

});

Doubts:

1- This approach is "correct"?

2- If I needed to search by company, date and value or only by date, would I add one more function? For example: getProjetosPorEmpresaDataValor or getProjetoPorData.

3- No controller I would need to have a function for each function of the service, with the appropriate parameters?

I’m using it this way so far. In the REST API (Node.js + express.js) I have a single function for GET /projetos which treats which data to bring according to the parameters received in the request.

As I have never developed a large application, I have several similar doubts, if you can point me some material to help in this direction it would be good.

Answer 1

There are several ways to write your services. There is nothing essentially wrong with your approach.

There are patterns, however, that are quite popular, such as the Style Guide of John Papa. That said, it should be noted that the way you structured your service is the model not recommended by most of the community. The reasons for this are all listed in the services.

Basically, Style Guide says it’s best to use function statements to hide implementation details, that is, keep Factory members accessible at the very top of the document so you can see, just when you open the file, what are the functions of that Factory and which functions can be accessed externally by other controllers. This makes it much easier when your service starts getting too long in large and complex applications.

To optimize your service, still, I would advise you to modify the parameters of your function _getProjects

var _getProjetos = function (query) {
    return $http.get(config.baseUrl + query);
};

In doing so, you get a much more reusable function in your Factory. To achieve the same results, you have to assemble queries in your controller according to the requirements of each call and only pass the final string pro service, which will run GET.

Examples of Style Guide

/* avoid */
function dataService() {

  var someValue = '';

  function save() {
    /* */
  };

  function validate() {
   /* */
  };

  return {
    save: save,
    someValue: someValue,
    validate: validate
  };

}

/* recommended */
angular
   .module('app.core')
   .factory('dataservice', dataservice);

function dataService() {

  var someValue = '';

  var service = {
    save: save,
    someValue: someValue,
    validate: validate
  };

  return service;

  ////////////

  function save() {
      /* */
  };

  function validate() {
      /* */
  };
}

Answer 2

This is yet another question regarding code review than the actual use of services.

1- This approach is "correct"?

Nothing invalid with it. It can, however, be improved, for example with the addition of caching or Promises according to the needs of the project.

2- If I needed to search by company, date and value or only by date, would I add one more function? For example: getProjetosPorEmpresaDataValor or getProjetoPorData?

You are using static interfaces for your methods. If the presence of parameters is variable, you can benefit from abstract interfaces to avoid creating an unnecessary number of functions corresponding to the parameter combinations.

For example, instead of:

var _getProjetos = function (pagina, total) {
    return $http.get(config.baseUrl + "/projetos?pagina=" + pagina + "&total=" + total);
};

You can implement the following abstract interface via object:

var _getProjetos = function (params) {
    return $http.get(config.baseUrl + "/projetos?" + $.param(params);
};

$.param() converts an object to the notation used in query strings. Your service call can be made that way, so:

var ret = svc.getProjetos({pagina: 1, total: 10});
// URL gerada: config.baseUrl + "/projetos?pagina=1&total=10";

If you want to add a company code:

var ret = svc.getProjetos({pagina: 1, total: 10, empresa: 128 });
// URL gerada: config.baseUrl + "/projetos?pagina=1&total=10&empresa=128";

3- In the controller I would need to have a function for each service function, with the appropriate parameters?

No. This will depend solely on your implementation model.