Pass value to service Factory in Engineering

Question

I need to pass two values (page and total) of $Scope that are in the controller to a Factory service, how do I? Is there any good practice to do this?

Service:

angular.module("myapp").factory("AtividadesAPI", function ($http, config) {

    var _getAtividades = function () {
        return $http.get(config.baseUrl + "/atividades");
    };

    var _getAtividadesPaginadas = function () {
        return $http.get(config.baseUrl + "/atividades?pagina=param1&total=param2");
    };

    return {
        getAtividades: _getAtividades,
        getAtividades: _getAtividadesPaginadas
    };

});

UPDATING

Controller:

carregarAtividades = function () {
    AtividadesAPI.getAtividades().success(function (data) {
        $scope.atividades = data;
    }).error(function (data, status) {
        $scope.message = "Aconteceu um problema: " + data;
    });
};

Answer 1

As discussed in the comments, although there is already an accepted answer, it shows only one way to update a given in Factory. Another method, and perhaps one of the best Angularjs tools, is to update the data by reference, that is, instead of calling a function that updates the data, you create a scope with reference to an object in Factory.

So when there is an update, be it in controller, Directive, Component, etc. The value in Factory will also be updated.

But, for this to work, you must follow a basic rule: Every value to be referenced must be defined within Factory. See this example:

angular.module(appModule)
.factory('empresaFactory', function() {
    //Factory
    const empresa = {}; //Esse objeto é apenas uma referência geral da factory, para que você acesse os dados ou funções;


    // Aqui declaramos os dados
    empresa.dados    = {}; //Dados da empresa
    empresa.produtos = []; //Lista de produtos da empresa


    // Aqui declaramos as funções
    /**
     * Função para atualizar os dados (declarados acima) após obter o endpoint de sua api
     */
    empresa.atualizaEmpresa= function(campo, valor) {
        return angular.extend(empresa[campo], valor); //Não sei se é extremamente necessário utilizar o extend, mas quando eu não utilizo desse modo, o comportamento é irregular
    }
    
    // Retornamos a factory
    return empresa;
})

As you can see, I created 2 references (object) empresa.dados and (array) empresa.produtos where we will store the data. As soon as you get the data, for example, loaded the company data from the database, you call the function empresa.atualizaDados to create the initial object, thus:

controller

$scope.empresa = empresaFactory.dados; //Cria a referência

empresaFactory.atualizaEmpresa('dados', $scope.dadosDaEmpresa); //Semelhante a primeira respota

//Ou deste modo
$scope.empresa = dadosDaApi; //dados obtidos do seu banco de dados

//Ou atualizar apenas um valor
$scope.empresa.nome = 'Novo nome da empresa';
$scope.empresa.cnpj = '11.222.333/0000-99';

The same thing goes for the array, you can do all the manipulation, see:

controller

$scope.produtos = empresaFactory.produtos;

$scope.produtos.push(novoProduto); //Adiciona um produto
$scope.produtos.splice(index, 1); //Remove um produto

All these updates I mentioned, they will reflect the result directly in the "source", ie in Factory, without calling the update manually.

---

Important!!!

Note that I still call a manual update at the Factory with this: empresaFactory.atualizaEmpresa('dados', $scope.dadosDaEmpresa);. I, particularly, I do this because when I get the initial data, it’s done within the solve of my state, so it’s just a more practical way, because I don’t need to create a reference just to update. I just update direct as parameter.

But that’s up to you.

I hope that I have been able to explain this clearly and that you will learn more about it. This method will help you if you have a complex application with data sharing in many locations.

Answer 2

You can simply pass them as a parameter to the function you created. Parameters are for that very purpose and you can confirm here Angular Styleguide - Factories.

angular.module("myapp").factory("AtividadesAPI", function ($http, config) {

    var _getAtividades = function () {
        return $http.get(config.baseUrl + "/atividades");
    };

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

    return {
        getAtividades: _getAtividades,
        getAtividadesPaginadas: _getAtividadesPaginadas
    };

});

Your controller will make the call:

AtividadesAPI.getAtividadesPaginadas($scope.pagina, $scope.total);

Answer 3

I think this helps you:

$http.get({
    url: config.baseUrl + '/atividades', 
    method: "GET",
    params: {pagina: param1, total: param2}
 })

Here shows other possibilities and types of arguments that can be passed on $http.get.

https://docs.angularjs.org/api/ng/service/$http#get https://docs.angularjs.org/api/ng/service/$http#Usage