Kan een AngularJS-controller erven van een andere controller in dezelfde module?

Binnen een module kan een controller eigenschappen erven van een externe controller:

var app = angular.module('angularjs-starter', []);
var ParentCtrl = function ($scope, $location) {
};
app.controller('ChildCtrl', function($scope, $injector) {
  $injector.invoke(ParentCtrl, this, {$scope: $scope});
});

Voorbeeld via: Dode link: http ://blog.omkarpatil.com/2013/02/controller-inheritance-in-angularjs.html

Kan een controller in een module ook van een broer of zus erven?

var app = angular.module('angularjs-starter', []);
app.controller('ParentCtrl ', function($scope) {
  //I'm the sibling, but want to act as parent
});
app.controller('ChildCtrl', function($scope, $injector) {
  $injector.invoke(ParentCtrl, this, {$scope: $scope}); //This does not work
});

De tweede code werkt niet omdat $injector.invokeeen functie als eerste parameter vereist en de verwijzing naar ParentCtrlniet vindt.

Antwoord 1, autoriteit 100%

Ja, dat kan, maar u moet in plaats daarvan de service $controllergebruiken om de controller te instantiëren:-

var app = angular.module('angularjs-starter', []);
app.controller('ParentCtrl', function($scope) {
  // I'm the sibling, but want to act as parent
});
app.controller('ChildCtrl', function($scope, $controller) {
  $controller('ParentCtrl', {$scope: $scope}); //This works
});

Antwoord 2, autoriteit 7%

Als je vm-controllersyntaxisgebruikt, is hier mijn oplossing:

p>

.controller("BaseGenericCtrl", function ($scope) {
    var vm = this;
    vm.reload = reload;
    vm.items = [];
    function reload() {
        // this function will come from child controller scope - RESTDataService.getItemsA
        this.getItems();
    }
})
.controller("ChildCtrl", function ($scope, $controller, RESTDataService) {
    var vm = this;
    vm.getItems = RESTDataService.getItemsA;
    angular.extend(vm, $controller('BaseGenericCtrl', {$scope: $scope}));
})

Helaas kunt u $controller.call(vm, 'BaseGenericCtrl'...)niet gebruiken om de huidige context door te geven als afsluiting (voor reload()) functie, daarom is er maar één oplossing om thisbinnen de overgenomen functie te gebruiken om de context dynamisch te veranderen.

Antwoord 3, autoriteit 3%

Ik denk dat je fabriek of service moet gebruiken om toegankelijke functies of gegevens voor beide controllers te geven.

hier is een soortgelijke vraag —> AngularJS-controllerovererving

Antwoord 4, autoriteit 3%

Als reactie op het probleem dat aan de orde is gesteld in dit antwoord van gmontague, heb ik een methode gevonden om een ​​controller te erven met $ controller(), en gebruik nog steeds de syntaxis van de controller “as”.

Gebruik eerst de syntaxis “as” wanneer u $controller() erft:

   app.controller('ParentCtrl', function(etc...) {
        this.foo = 'bar';
    });
    app.controller('ChildCtrl', function($scope, $controller, etc...) {
        var ctrl = $controller('ParentCtrl as parent', {etc: etc, ...});
        angular.extend(this, ctrl);
    });

Vervolgens, in HTML-sjabloon, als de eigenschap is gedefinieerd door ouder, gebruik dan parent.om eigenschappen op te halen die zijn overgenomen van ouder; indien gedefinieerd door kind, gebruik dan child.om het op te halen.

   <div ng-controller="ChildCtrl as child">{{ parent.foo }}</div>