3

Estou de desenvolvendo uma ferramenta usando AngularJS, mas estou apanhando constantemente dele, eu preciso reaproveitar código de diferentes módulos e arquivos, mas não está funcionando corretamente. Com javascript puro, é tranquilo reutilizar outras funções, mesmo em arquivos diferentes, elas "se enxergam", mas com angularJs não é bem assim, achei que fosse algo parecido com JAVA, onde vc precisa importar a classe e criar uma instancia, mas também to vendo que não é por esse caminho, alguem poderia me mostrar um exemplo de reutilização de funções em diferentes módulos e arquivos em AngularJS?

2 Respostas 2

1

Basicamente existem duas formas, definindo como um serviço ou colocando ela no seu escopo de root. O ideal é criar um serviço para não ficar poluindo seu escopo "root". Você pode criar um serviço e deixar ele disponível na sua controller assim:

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.factory('myService', function() {
        return {
            foo: function() {
                alert("I'm foo!");
            }
        };
    });

    myApp.controller('MainCtrl', ['$scope', 'myService', function($scope, myService) {
        $scope.callFoo = function() {
            myService.foo();
        }
    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="callFoo()">Call foo</button>
</body>
</html>

Se não rolar, você pode adicionar nos eu escopo de root assim:

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.run(function($rootScope) {
        $rootScope.globalFoo = function() {
            alert("I'm global foo!");
        };
    });

    myApp.controller('MainCtrl', ['$scope', function($scope){

    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="globalFoo()">Call global foo</button>
</body>
</html>

Dessa maneira todos seus templates podem chamar globalFoot() sem ther que passar isso para o template da controller.

Fonte: https://stackoverflow.com/questions/15025979/can-i-make-a-function-available-in-every-controller-in-angular

1
  • eu cheguei a criar um service para reaproveitar algumas funções em outro modulo, funciona, mas não consigo reutilizar mais outro modulo. por exemplo: em javascript: 1.js>(depende)2.js>(depende)3.js, em agular pensei algo como, modulo1>(depende)services>(pertencente) modulo2. igual onde eu perguntei pt.stackoverflow.com/questions/93558/… 21/10/2015 às 15:43
0

Você pode criar um modulo commons similar ao de baixo. Nesse uso modulo utils.commom para deixar os métodos genéricos. Aliado a isso você também pode criar diretivas comuns ao teu programa. Caso não deseje usar um novo modulo pode compartilhar dados usando um serviço do próprio angular.

var commom = angular.module("utils.commom", []);
commom.factory("$commomutils", function($http, $q, $injector) {
    return({
    	fazAlgo:function(algumaCoisa){
            console.log(algumaCoisa);
        }
    });
});

var appQualquer = angular.module("AppQualquer", ["utils.commom"]);
appQualquer.controller("ControllerQualquer", function($scope, $commomutils) {
	$scope.iniciar = function() {
	    $commomutils.fazAlgo("JEC não vai cair!!! Figueira freguês!!!");
	};
});

appQualquer.directive("diretiva", [function () {
    return {
        restrict : "E",
	replace : true,
	link : function(scope, element, attr) {
            angular.element(element).html("Figueira FREGUES!!! JEC Maior de SC");
	}
    };
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="AppQualquer" ng-controller="ControllerQualquer" ng-init="iniciar();">
  <diretiva>UH</diretiva>
</div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .