Click here to Skip to main content
15,741,818 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I have made two separate files home.html & ctrl1.html . In home.html, I created main controller and routing while ctrl.html contains a simple controller. Here is the code

<html ng-app="testApp">
<body ng-controller="testCtrl">
    <div ng-view></div>

<script src="angular-1.2.1/angular.js"></script>
<script src="angular-1.2.1/angular-route.js"></script>

<script language="javascript">
    var testApp = angular.module('testApp', ['ngRoute']);

    function testCtrl($scope, $rootScope, $http) {
        $rootScope.TestVar = 'Welcome';
    testApp.controller('testCtrl', testCtrl);

            function ($routeProvider) {
                    when('/Users', {
                        templateUrl: 'ctrl1.html',
                        controller: '',
                        title: 'Users'
                   redirectTo: 'Users',
                   title: 'Welcome'


<script language="javascript">
    function Ctrl1($scope, $rootScope, $http) {
        $rootScope.TestVar = 'Hello';

   angular.module('testApp').controller('Ctrl1', Ctrl1);

<div ng-controller="Ctrl1">
   Some thing here {{Test}}

When I browse to User router, it gives me following error.
Error: [ng:areq] Argument 'Ctrl1' is not a function, got undefined
Konstantin A. Magg 31-Jan-16 16:31pm    
Do you reference ctrl.html somewhere from home.html? Does this file get loaded in your app?
iamalik 1-Feb-16 8:47am    
Does it require to add ctrl.html?
Konstantin A. Magg 1-Feb-16 9:32am    
My guess is, `Ctrl1` is not defined because the script in ctrl.html is not laoded or not loaded in the right place.

Do you have a missmatch in your file names?
- templateUrl: ctrl1.html
- ctrl.html
iamalik 2-Feb-16 2:38am    
No, file names are not different.
Actually router loads file in but doesn't register Controller.

1 solution

Fixing the HTML file name above does not solve your problem. You still cannot resolve the ng-controller in this line: <div ng-controller="Ctrl1"></div>.

You run into several problems here:

  1. Just because you include a <script> in ctrl.html, the code does not get automatically called (Try it with an alert("Hello World"); after registering your controller).
  2. I am not sure, if you can register a controller after your ng-app is fully loaded and the configuration phase is finished.

I suggest, you re-thing the structure of your files and the procedure to startup your ng-app.

Hope this helps.
Share this answer

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900