Search code examples
angularjsangular-servicesngrouteangular-controller

AngularJS routing inside a factory


I want to create a factory for routing purposes. I want to encapsulate this in a factory because I want to exchange info from one page to another. I don't know if this is the best practice. Please tell me if there are other better ways.

This is my controller:

angular.module('app.core')
.controller('mainCtrl', ['ShowService', 'ChangeViews', function(ShowService, ChangeViews){
    var vm = this;
    vm.namespaces = [];
    vm.servers = [];
    vm.p4path = '';
    vm.gitpckname = '';
    vm.server = '';
    vm.ns = '';

    ShowService.getNamespaces().then(function(response){
        var data = angular.fromJson(response.data);
        angular.forEach(data.namespaces, function(value){
            vm.namespaces.push(value);
            vm.initNamespaceSelVal = vm.namespaces[0];
            vm.ns = vm.namespaces[0];
        });
    });

    ShowService.getServers().then(function(response){
        var data = angular.fromJson(response.data);
        angular.forEach(data.servers, function(value){
            vm.servers.push(value);
            vm.initServerSelVal = vm.servers[0];
            vm.server = vm.servers[0];
        });
    });

    vm.doClick = function(value){
        if(value){
            var body = {};
            body['server'] = vm.server;
            body['p4path'] = vm.p4path;
            body['packagename'] = vm.gitpckname;
            body['namespace'] = vm.ns;
            ShowService.getBraches(body).then(function(response){
                console.log(response);
                //$location.path('/hidden');
                //ChangeViews.changeView('/hidden');
            });
        };
    };
}]);

In the above code, I injected two custom made factories into controller. The "ShowService" works properly but the "ChangeViews" returns some errors.

Using $location service inside the controller(the commented line) works.

The factory code is:

angular
    .module('app.services')
    .constant('BASE_URL', 'http://localhost:8066')
    .factory('ShowService', dataService)
    .factory('ChangeViews', changeViews);

function dataService($http, BASE_URL){.....}
function changeViews($location, view){
    var data = {
        'changeView': changeView,
    };

    function changeView(view){
        return $location.path(view);
    };

    return data;
}

The path to the html template is routed. The error I'm receiving when injecting the ChangeViews factory is:

"Error: [$injector:unpr] http://errors.angularjs.org/1.5.5/$injector/unpr?p0=viewProvider%20%3C-%20view%20%3C-%20ChangeViews

What I'm missing?

Thank you


Solution

  • The problem is that you don't have injectable service named view, hence the unknown provider error.

    Remove view from changeViews parameters list:

    function changeViews($location) {
        var data = {
            changeView: changeView
        };
    
        function changeView(view) {
            return $location.path(view);
        };
    
        return data;
    }