Question

我目前使用的模块是来自其他模块的复制粘贴代码。显然这是不对的，所以我试图包含共享资源（模块）以避免这种冗余。

以下是设置草图：

angular.module('shared', []);
angular.module('shared').controller('SharedController', SharedControllerFunc);

function SharedControllerFunc(/*params*/) {
    /*logic*/
}

angular.module('app', ['shared']);
angular.module('app').controller('myController', myControllerFunc);

console.log(angular.module('app').controller('SharedController'));
//looks good!

//HTML template

<div ng-controller="myController">

  <div ng-controller="SharedController" ng-include="other-template.html"></div>

</div>

并且SharedController不存在。

我的问题是：如何让SharedController正确解析？我尝试使用$controller服务并在SharedController的范围内创建MyController，但看起来像，因为它存在传递依赖性问题（{{1}错误Unknown provider）。

必须有一种干净，简单的方法来做到这一点，我忽略了。

Answer 1

我在这里为你做了一个例子：http://plnkr.co/edit/dBDyYPd3ZoUVdXngu52t?p=preview

如果你有2个带模块的文件 - app和shared：

//app.js
var app = angular.module('app', ['shared']);
app.controller('myController', myControllerFunc);

function myControllerFunc($scope) {
  $scope.test = 'myControllerFunc';
   console.log('myControllerFunc called');
}


//shared.js
var shared = angular.module('shared', [])
shared.controller('SharedController', SharedControllerFunc);

function SharedControllerFunc($scope) {
  $scope.test = 'SharedControllerFunc';
   console.log('SharedControllerFunc called');
}

稍后您可以在另一个内部继承一个控制器：

<div ng-controller="myController">
{{test}}
  <div ng-controller="SharedController">
    {{test}}
  </div>
</div>

Answer 2

通常重用ng-controller中的控制器表示需要执行常规任务并保持代码库DRY的指令或服务。但是，同一个控制器可以在几个指令或路径中重复使用。

列出的代码没问题。除此之外：

console.log(angular.module('app').controller('SharedController'));

controller方法不用于返回已注册控制器的工厂功能。它基本上等于用

覆盖控制器

angular.module('app').controller('SharedController', undefined);

Angular - 如何跨模块共享控制器？

2 个答案: