有人可以提供 AngularJS 中 $controller 服务的用例吗?

Can someone provide a use case for the $controller service in AngularJS?

Angularjs 文档给出了 $controller 服务的用法: $controller(constructor, locals);

谁能把重点放在这两点上:

  1. 何时使用 $controller 服务。请提供一些用例。
  2. 有关传递给它的 'locals' 参数的详细信息。

举一个例子,它在单元测试期间创建目标控制器时很有用。

假设您有一个签名为 .controller('MainCtrl', function($scope, serviceA){..}) 的控制器。

测试中,

// ...

beforeEach(inject(function ($rootScope, $controller, serviceA) {

  // assign injected values to test module variables
  scope = $rootScope.$new();
  service = serviceA

  // create the controller, by passing test module variables values as dependencies
  $controller('MainCtrl', {'$scope': scope, 'serviceA': service});
}));

it('test on controller', function() {
  //...
});

更多信息结帐:https://docs.angularjs.org/guide/unit-testing

您可以将要在 $scope 上执行的通用函数创建到一个可以命名为 'CommonCtrl' 的控制器中。

angular.module('app',[]).controller('CommonCtrl', ['$scope', function($scope){
      var self = this;
      $scope.stuff1 = function(){

      }

      $scope.stuff2 = function(){

      }
      self.doCommonStuff = function(){
               // common stuff here
               $scope.stuff1();
               $scope.stuff2();

      };
      return self;
}]);

然后在其他控制器中注入这个控制器让我们说 'TestCtrl1' 就像

angular.module('app',[]).controller('TestCtrl1', ['$scope','$controller', function($scope, $controller){
        var commonCtrl = $controller('CommonCtrl',{$scope: $scope}); // passing current scope to commmon controller
        commonCtrl.doCommonStuff();
}]);

在这里,$controller 服务的第二个参数,我们正在传递 CommonCtrl 所需的依赖项。所以 doCommonStuff 方法将使用 TestCtrl1 控制器的范围。

您也可以使用该服务实现控制器继承。

angular.module('app',[]).controller('BaseCtrl', ['$scope', function($scope){
  $scope.action1 = function(){
    console.log('In BaseCtrl action1');
  }

  $scope.action2 = function(){
    console.log('In BaseCtrl action2');
  }

}]);

angular.module('app').controller('ChildCtrl', ['$scope', function($scope){

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

  $scope.action1 = function(){
    console.log('Overridden in ChildCtrl action1');
  }

  $scope.action2 = function(){
    console.log('Overridden in ChildCtrl action2');
  }

}]);