Наследование объектов углового контроллера

Question

Я действительно не понимаю, как наследовать объекты контроллера в угловом (не используя $ scope), когда мы окружаем их в IIFE.

Так что у нас есть 2 контроллера файлы:

Animal.js

(function() { 
    'use strict'; 
    angular.module('myApp').controller('animalCtrl', function() { 
     this.strength = 3; 
     this.speed = 3; 
}); 
})(); 

Beaver.js

(function() { 
    'use strict'; 
    angular.module('myApp').controller('beaverCtrl', function() { 
     //How do I inherit the parent controllers stats? 
}); 
})(); 

Как я могу наследовать от animalCtrl с помощью моего beaverCtrl?

Answer 1

Лучший способ обмена данными на любом сайте angularjs - это воспользоваться услугами. В этом случае я бы создал фабрику, которая будет хранить силу и скорость и делиться ею с beaverCtrl.

angular.module('<yourappname>', []) 
    .factory('dataService', function() { 
    $scope = this; 

    $scope.strength = null; 
    $scope.speed = null; 

    $scope.setStrength = function(value) { 
     $scope.strength = value; 
    } 

    $scope.setSpeed = function(value) { 
     $scope.speed = value; 
    } 
    return $scope; 
}) 

Тогда в контроллерах вы могли бы назвать услугу, как этот

.controller('animalCtrl', function(dataService) { 
    this.strength = 3; 
    this.speed = 3; 

    dataService.setStrength(this.strength); 
    dataService.setSpeed(this.speed); 

}); 

.controller('beaverCtrl', function(dataService) { 
    this.strength = dataService.strength; 
    this.speed = dataService.speed; 
}); 

Answer 2

Это важно понимать, что AngularJS контроллер просто обычный JavaScript «класс». Единственный улов - вызов базового конструктора с инъекцией зависимостей.

// Create some base class. 
BaseController = function($scope, $route) { 
    // Do some stuff here. 
}; 

// The base class has some behavior. 
BaseController.prototype.someMethod = function() { /* do something */ }; 

// Create some child class. 
ChildController = function($scope, $injector) { 
    // Invoke the base constructor. 
    $injector.invoke(this, BaseController, {$scope: $scope}); 
}; 

// Inherit from the base class. 
ChildController.prototype = Object.create(BaseController.prototype); 

// Add more specific behavior. 
ChildController.prototype.someChildMethod = function() { /* do something */ }; 

Затем вы можете зарегистрировать свой контроллер как

angular.module('myApp').controller('ChildController', ChildController); 

Имейте в виду, что с помощью наследования, как это будет проблематично, если слишком часто. Его следует использовать только для обмена поведением. Кроме того, использование состава разных «классов», как правило, будет гораздо более гибким, чем использование наследования.

С точки зрения организации кода, я бы также рекомендовал вам объявлять контроллеры в одном месте (по одному файлу на контроллер) и регистрировать их на модулях в другом месте (по одному файлу на модуль).