小编典典

扩展 AngularJS 控制器的推荐方法是什么?

all

我有三个非常相似的控制器。我想要一个控制器,这三个扩展并共享其功能。


阅读 62

收藏
2022-07-08

共1个答案

小编典典

也许 不扩展控制器,但可以扩展控制器或使单个控制器成为多个控制器的混合。

module.controller('CtrlImplAdvanced', ['$scope', '$controller', function ($scope, $controller) {
    // Initialize the super class and extend it.
    angular.extend(this, $controller('CtrlImpl', {$scope: $scope}));
    ... Additional extensions to create a mixin.
}]);

创建父控制器时,其中包含的逻辑也会被执行。有关更多信息,请参见 $controller(),但仅$scope需要传递值。所有其他值将正常注入。

@mwarren ,Angular 依赖注入会自动解决您的问题。您只需要注入 $scope,但如果需要,您可以覆盖其他注入的值。举个例子:

(function(angular) {



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



    module.controller('simpleController', function($scope, $document) {

        this.getOrigin = function() {

            return $document[0].location.origin;

        };

    });



    module.controller('complexController', function($scope, $controller) {

        angular.extend(this, $controller('simpleController', {$scope: $scope}));

    });



})(angular);


<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.js"></script>



<div ng-app="stackoverflow.example">

    <div ng-controller="complexController as C">

        <span><b>Origin from Controller:</b> {{C.getOrigin()}}</span>

    </div>

</div>

虽然 $document 在由 ‘complexController’ 创建时并没有传递到 ‘simpleController’ 中,但 $document
是为我们注入的。

2022-07-08