David_ult
David_ult

Reputation: 17

Loading modules in Angularjs

I have a problem trying to load some modules.

controller1.js:

angular.module('LPC')
   .controller('lista_peliculas_controller', ['$scope', function($scope) {
       $scope.hola="hola peliculas";
   }]);

And app.js:

var app = angular.module('mis_peliculas', []);

app.config(function($routeProvider){
    $routeProvider
        .when("/pagina_principal",{
            templateUrl: "views/pagina_principal.html",
            controller: "lista_peliculas_controller"
        })
        .when("/lista_peliculas",{
            templateUrl: "views/lista_peliculas.html",
            controller: "lista_peliculas_controller"
        })
        .when("/lista_series",{
            templateUrl: "views/lista_series.html",
            controller: "lista_series_controller"
        })
        .otherwise({
            redirectTo: "/pagina_principal"
        })
});

The console says that there is a problem with the injector. Can you find the error?

Upvotes: 1

Views: 1395

Answers (4)

Chait
Chait

Reputation: 501

You need to pass in the 'LPC' Module to your app 'mis_peliculas' module for it use the 'lista_peliculas_controller' Controller which is in 'LPC' Module.

Try this code

angular.module('LPC',[])
   .controller('lista_peliculas_controller', ['$scope', function($scope) {
       $scope.hola="hola peliculas";
   }]);

This should be your controller1.js and should be defined before you define your app. Now the app.js should look like

var app = angular.module('mis_peliculas', ['LPC']);

    app.config(function($routeProvider){
        $routeProvider
            .when("/pagina_principal",{
                templateUrl: "views/pagina_principal.html",
                controller: "lista_peliculas_controller"
            })
            .when("/lista_peliculas",{
                templateUrl: "views/lista_peliculas.html",
                controller: "lista_peliculas_controller"
            })
            .when("/lista_series",{
                templateUrl: "views/lista_series.html",
                controller: "lista_series_controller"
            })
            .otherwise({
                redirectTo: "/pagina_principal"
            })
    });

This should remove all the errors and you should be able to use the controller from other module.

Hope it helps

Upvotes: 0

Karim
Karim

Reputation: 8632

without the complete log of the error i can't be more precise, but i think that the injection error could be related to your module not being instantiated.

try to change

angular.module('LPC') //here you get a reference to a module, that could cause your error

to

angular.module('LPC', []) //here you instantiate a module

Upvotes: 0

ooozguuur
ooozguuur

Reputation: 3466

You must add angular-route.js . Reference

The ngRoute module provides routing and deeplinking services and directives for AngularJS apps.

How do you fix it?

var app = angular.module('mis_peliculas', ['ngRoute','LPC']);

And

angular.module('LPC', [])

Upvotes: 2

Kumar Nitesh
Kumar Nitesh

Reputation: 1652

Update your code to use right module name:

angular.module('mis_peliculas')
   .controller('lista_peliculas_controller', ['$scope', function($scope) {
       $scope.hola="hola peliculas";
   }]);

and if you want to use separate modules, you need to initiliaze it first and inject it into your main module

angular.module('LPC',[])
   .controller('lista_peliculas_controller', ['$scope', function($scope) {
       $scope.hola="hola peliculas";
   }]);

var app = angular.module('mis_peliculas', ['LPC']);

I assume your routing is already set correctly.

Upvotes: 0

Related Questions