Controller chaining in angularJS

Question

/**
 * Created with JetBrains WebStorm.
 * User: Faizan
 * Date: 3/7/14
 * Time: 6:09 PM
 * To change this template use File | Settings | File Templates.
 */
angular.module("myApp",[])
.controller("CtrlParent",function($scope){
      $scope.ParentFunc= function(){
          alert("This is Parent");
         // $scope.$on("hello");
      }
    })
.controller('CtrlBigChild',function($scope){
        $scope.BigChildFunc= function(){
            alert("This is Big Child");
           // $scope.$on("hello");
        }
    })
.controller('CtrlChildOne',function($scope){
        $scope.ChildOneFunc= function(){
            alert("This is Child One");
         //   $scope.$on("hello");
        }
    })
.controller('CtrlChildTwo',function($scope){
        $scope.CtrlChildTwoFunc= function(){
            alert("This is Child Two");
          //  $scope.$on("hello");
        }
})
.controller('CtrlChildOneChild',function ($scope){
        $scope.ChildOneChildFunc= function(){
            alert("This is Child one's Child");
         //   $scope.$on("hello");
        }
    })
.controller('CtrlChildTwoChild',function($scope){
        $scope.ChildTwoChildFunc= function(){
            alert("This is Child Two's Child");
        //    $scope.$on("hello");

        }
    })

1: Failed to load resource file:///C:/Users/Faizan/WebstormProjects/AngularJS%20emit%20broadcase%20controller/js/controller.js.js

2 :Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.10/$injector/modulerr?p0=myApp&p1=Error%3A%…rJS%2520emit%2520broadcase%2520controller%2Fjs%2Fangular.min.js%3A17%3A431)

j.wittwer · Accepted Answer · 2014-03-10T07:07:59.893

1

Make sure you are referencing the correct module in ng-app.
<body ng-app="myApp">

This demo contains your code, and produces no errors.

You can reproduce error 2 by changing ng-app (under fiddle options) to something else like:
<body ng-app="banana">

And, make sure that you reference angular before your javascript filess, such as controller.js.

edited Mar 10 '14 at 07:07

answered Mar 10 '14 at 06:46

j.wittwer

9,497
3
30
32

i have chekcked still facing Uncaught ReferenceError: angular is not defined controller.js:9 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.10/$injector/modulerr?p0=myApp&p1=Error%3A%…rJS%2520emit%2520broadcase%2520controller%2Fjs%2Fangular.min.js%3A17%3A431) – Mohammad Faizan khan Mar 10 '14 at 06:55
1

reference to angular must be before your controller.js file. – j.wittwer Mar 10 '14 at 06:58
great, i added that suggestion to the answer. – j.wittwer Mar 10 '14 at 07:08

Controller chaining in angularJS

1 Answers1