Extending angularJS modules

Question

I'm learning Angular JS coming from a Java background. I've written my first module and I'd like to extend it- from my (beginner) perspective it looks like a Class which can be extended. So I've coded the following which includes two modules: myApp and myApp2.

Angular JS Code:

var myApp = angular.module('myApp', []);

myApp.controller('UserCtrl', ['$scope', function ($scope) {

    $scope.name="cat";
    $scope.type="pet";

}]);

var myApp2 = angular.module('myApp2', ['myApp']);

myApp2.controller('UserCtrl', ['$scope', function ($scope) {

    $scope.name="dog";

}]);

HTML Code

<body ng-app="myApp2">

    <div ng-controller="UserCtrl">

        <p>{{ name }}</p>
        <p>{{ type }}</p>
    </div>

In the above example, myApp2 "type" evaluates to "". Is it possible to inherit properties and methods from MyApp?

Thanks!

Possible duplicated: Can an AngularJS controller inherit from another contoller in the same module? — D.Evangelista
– D.Evangelista, Commented Feb 27, 2014 at 10:45

asgoth · Accepted Answer · 2014-02-27 11:35:50Z

2

It is easier to extend controllers. In the example below, CatCtrl inherits the AnimalCtrl scope:

<div ng-controller="AnimalCtrl">
    <p>{{ animal.name }}</p>
    <p>{{ animal.type }}</p>

   <div ng-controller="CatCtrl">
       <p>{{ animal.race }}</p>
   </div>
</div>

myApp.controller('AnimalCtrl', ['$scope', function ($scope) {

 $scope.animal = {
   gender: "M",
   type: ""
   ...
 };

}]);

myApp.controller('CatCtrl', ['$scope', function ($scope) {

 angular.extend($scope.animal, {
   type: "Cat",
   race: "Albino"
   ...
 });

}]);

edited Feb 27, 2014 at 11:35

answered Feb 27, 2014 at 11:04

asgoth

35.8k12 gold badges91 silver badges98 bronze badges

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

Collectives™ on Stack Overflow

Extending angularJS modules

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related