CODEWITHSUNDEEP
javascriptangularjs
Laerte Sousa Neto
Laerte Sousa Neto

Reputation: 160

routingProvider not working with controller form separate file

I'm having a problem with loading controllers to a specific route in AngularJS when using routeProvider service. It works fine if I define the controller in the same file as the file I declared the module in, but I want the controllers to be in a separate file. When I try to load them from a separate file I get an error, saying the controller was not found.

Here's my code:

(pixelApp.js)

'use strict';

var pixelApp = angular.module('pixelApp',['ngRoute'])
.config(function routing($routeProvider)
{
    $routeProvider.when('/',
        {
            templateUrl: '../directory/home.html',
            controller: 'homeCTRL'
        }
    );

    $routeProvider.otherwise(
        {
            redirectTo: '/'
        }
    );
});

(homeCTRL.js)

'use strict';

pixelApp.controller('homeCTRL',
   function homeCTRL($scope)
   {
       $scope.message = "Welcome to home.";
   }
);

(index.html)

<body>

<ng-view></ng-view>

<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>

<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/angular-route.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>

<!-- App Module -->
<script type="text/javascript" src="js/pixelApp.js"></script>
<!-- App Module -->

<!-- View Controllers -->
<script type="text/javascript" src="js/controller/homeCTRL.js" />
<!-- View Controllers -->



</body>

I have looked spent a lot of time looking for a solution and couldn't find it, it would be greatly appreciated if anybody could help me out with this.

Upvotes: 0

Views: 47

Answers (2)

vittore
vittore

Reputation: 17589

You are using use strict and referencing undefined variables.

(pixelApp.js)

var pixelApp = window.pixelApp = angular.module('pixelApp',['ngRoute'])

...

(homeCTRL.js)

window.pixelApp.controller(....)

Upvotes: 0

Daniel
Daniel

Reputation: 7016

I guess the problem is simply your script tag

<script type="text/javascript" src="js/controller/homeCTRL.js" />

should be

<script type="text/javascript" src="js/controller/homeCTRL.js"></script>

Upvotes: 1

Related Questions