The controller with name is not registered when loading the html through template

Question

I am currently trying to change my web app from routing through mvc to SPA, where all different will be loaded in single main page. For this I am using ngview directive. This is the main page -

<div ng-app="app">
     <div ng-view>
    </div>
</div>

@section Scripts{
    <script src="~/Scripts/angular-route.js"></script>
    <script>
       var app=angular.module('app',['ngRoute']);

        app.config(function ($routeProvider,$locationProvider) {
            $routeProvider
            .when("/", {
                templateUrl: "Experimental/Index.html",
                controller:"AddressList"

            })

        });

</script>

}

For now I only have one route. my controller is defined in a script tag inside the Index.html file itself and not in a seperate .js file like so -

  angular.module('app')
    .controller('AddressList', ['$scope', '$http', function ($scope, $http) {

        $scope.model = [];
        $http.get('/Addresses/GetAddresses').then(function (response) {
            if (response != null || response != "undefined") {
                $scope.model = response.data;
            }
        });

    }]);

But after load of the main page I am getting an error message -

The controller with name 'AddressList' is not registered.

Does this mean I have to keep all my controllers in seperate files or inside the main html?

Can you create a fiddle for your code. It would be much easier to debug. — Lone Ranger
– Lone Ranger, Commented Oct 5, 2019 at 19:23
The AngularJS framework ignores controllers defined in templateUrl files. All controllers need to be defined before the DOMContentLoaded event. — georgeawg
– georgeawg, Commented Oct 6, 2019 at 2:47

Maher · Accepted Answer · 2019-10-06 11:12:42Z

1

We have 2 reasons to not registered message in Angularjs:

The source is not defined in your app

<script defer src="angular.js"></script>
<script defer src="app.js"></script> <!-- app.module(...) -->
<script defer src="controller.js"></script> <!-- app.controller(...) -->

Register controller in your app config, this happens when you load controllers as lazy

Note: Not different if you have a separate file for your controller or inline script

var app = angular.module("app", []);
app.config(function($controllerProvider){
    app.controller = $controllerProvider.register;
})

answered Oct 6, 2019 at 11:12

Maher

2,5471 gold badge21 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

The controller with name is not registered when loading the html through template

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related