gh9
gh9

Reputation: 10703

Accessing a controller from Angular UI routing

(function () {

    var app = angular.module('foo', ['bar'])
    .config(function ($stateProvider, $urlRouterProvider) {
        $stateProvider
        .state('home', {
            url:'/home/:Id',
            templateUrl: '/foo/template.thml',
            controller: 'bar'
        })

    });

})();

Here is the Index.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<body ng-app="steve">

    <div ui-view></div>
</body>
</html>


<script type="text/javascript" src="Scripts/angular.min.js"></script>
<script type="text/javascript" src="Scripts/angular-ui-router.js"></script>
<script type="text/javascript" src="app/user/BarController.js"></script>
<script type="text/javascript" src="app/App.js"></script>

And The bar controller

(function () {

    var app = angular.module('bar', []);
    app.controller('barCTRL', function () {
        this.mark = 'mark test';
    });


})();

I have a controller created in another JS file, and want to pass it through the controller option in the .state config section. Whenever I do i get this error

Any help would be much appreciated. Thank you very much!

Upvotes: 0

Views: 31

Answers (1)

Thierry
Thierry

Reputation: 5243

Try this:

var app = angular.module('foo', ['bar'])
    .config(function ($stateProvider, $urlRouterProvider) {
        $stateProvider
        .state('home', {
            url:'/home/:Id',
            templateUrl: '/foo/template.thml',
            controller: 'barCTRL'
        })

    });

Upvotes: 2

Related Questions