In AngularJS, the controller inherits, and the commonly used scope nesting scope is the scope. By default, when a property cannot be found in the current scope, it will be searched in the parent scope, if it cannot be found until $rootScope is found.
But in some cases, rootScope is our controller, and it is impossible to write a large number of public attribute methods into rootScope.
For example, if there are multiple similar pages, all with breadcrumbs, search bars, toolbars, tables and other elements. If the breadcrumbs tables are considered to be directly, then there will inevitably be many similar configurations that need to be passed from the controller to the component, and many tool-like methods will also be generated for processing data. At this time, it is obviously ugly to repeat the same code in the controller of each page, so inheritance is required.
Found a solution on StackOverflow, it turns out that AngularJS has taken this into consideration and provides $controller
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});The above is the relevant knowledge that the AngularJS controller inherits from another controller introduced to you. I hope it will be helpful to everyone!