Angularjs 如何为两个不同的视图重用一个控制器？

我定义了一个控制器，并将其应用于两个有微小差异的视图

角度代码：

app.controller('MyCtrl', function($scope) {
   $scope.canSave = false;
   $scope.demo = {
      files : [{
         filename: 'aaa.html',
         source: '<div>aaa</div>'
      }, {
         filename: 'bbb.html',
         source: '<div>bbb</div>'
      }]
   }
   $scope.newFile = function(file) {
       $scope.demo.files.push(file);
   }
   $scope.$watch("demo.files", function(val) {
       $scope.canSave = true;
   }, true);
});

app.controller（'MyCtrl'，函数（$scope）{
$scope.canSave=false；
$scope.demo={
档案：[{
文件名：“aaa.html”，
资料来源：“aaa”
}, {
文件名：“bbb.html”，
资料来源：“bbb”
}]
}
$scope.newFile=函数（文件）{
$scope.demo.files.push（文件）；
}
$scope.$watch（“demo.files”，函数（val）{
$scope.canSave=true；
}，对）；
});

视图1：

<div ng-controller="MyCtrl"></div>

视图2：

<div ng-controller="MyCtrl"></div>

示例代码非常简单，但在我的实际项目中有很多代码和逻辑

视图1和视图2的功能几乎相同，只是有一些不同，但我确实需要在控制器中为它们中的每一个编写一些代码

我不想为它们创建两个不同的控制器，因为它们具有大部分相同的逻辑。我不想将逻辑移动到服务以在两个控制器之间共享它，因为逻辑对于服务来说并不常见

---

还有其他方法吗？

在给定的条件下，我可能会这样做

function MyCommonCtrl(type){
    return function($scope, $http) {
        $scope.x = 5;

        if(type = 't1'){
            $scope.domore = function(){
            }
        }

        ....
        ....
    }
}

angular.module('ng').controller('Type1Ctrl', ['$scope', '$http', MyCommonCtrl('t1')]);
angular.module('ng').controller('Type2Ctrl', ['$scope', '$http', MyCommonCtrl('t2')]);

然后

及

---

我不知道您的具体设置，但您的两个控制器可以从一个共同的祖先继承

Type1Ctrl.prototype = new MyCtrl();
Type1Ctrl.prototype.constructor = Type1Ctrl;

function Type1Ctrl() {
  // constructor stuff goes here
}

Type1Ctrl.prototype.setScope = function() {
  // setScope
};

Type2Ctrl.prototype = new MyCtrl();
Type2Ctrl.prototype.constructor = Type2Ctrl;

function Type2Ctrl() {
  // constructor stuff goes here
}

Type2Ctrl.prototype.setScope = function() {
  // setScope
};

---

我也面临类似的问题，范围继承解决了我的问题。 我想“重用”一个控制器来继承公共状态/模型（$scope）和功能（附加到$scope的控制器功能）

---

如I将父控制器附加到外部DOM元素，将子控制器附加到内部DOM元素中所述。父控制器的范围和功能无缝地“合并”到子控制器中。

这里是另一个选项。稍微修改自

---

因此，只要将两个视图所需的所有内容都放在一个控制器中，您就可以开始了……不需要在任何地方和任何地方使用逻辑将其移动到服务中。一个服务需要是你的大部分逻辑应该去的地方，不管它是共享的还是不共享的。对我来说，这看起来更像是一个黑客，但更像是一个解决方案。因此-1。我更喜欢@axzr way建议的使用继承的干净解决方案。我认为这确实是一个糟糕的解决方案。我喜欢这个解决方案——一个真正的函数，支持传统的javascript方法，几乎没有缺点。完全可测试、灵活且易于理解。继承很可能会让你头疼，因为它的工作方式不太明显，并且增加了拥有和继承财产的复杂性。我同意马格纳斯的观点。最好避免JS中的继承。这是一个很好的解决方案。也许将MyCommonCtrl重命名为CreateController，因为它更像一个工厂。您还可以应用所有对象生成模式来构建可重用的控制器。我从来没有编写过这样的控制器，您能给我提供更多信息吗？@Freewind:当然。你能从你现有的控制器中发布更多的逻辑吗？我可以帮助你使用继承来塑造它们？要么就是这样，要么就阅读一下Javascript中的继承。@Freewind:为了进一步帮助您，如果您能告诉我您的控制器是如何随视图而变化的，这将非常有用。你现在是否在做任何事情来改变它基于视图的行为，或者你仍在计划这样做？在Angular.JS 1.3+断开的博客链接中，这被认为是不好的做法。

<div ng-controller="Type2Ctrl"></div>

Type1Ctrl.prototype = new MyCtrl();
Type1Ctrl.prototype.constructor = Type1Ctrl;

function Type1Ctrl() {
  // constructor stuff goes here
}

Type1Ctrl.prototype.setScope = function() {
  // setScope
};

Type2Ctrl.prototype = new MyCtrl();
Type2Ctrl.prototype.constructor = Type2Ctrl;

function Type2Ctrl() {
  // constructor stuff goes here
}

Type2Ctrl.prototype.setScope = function() {
  // setScope
};

app.factory('ParentCtrl',function(){
    $scope.parentVar = 'I am from the parent'
  };
});

app.controller('ChildCtrl', function($scope, $injector, ParentCtrl) {
  $injector.invoke(ParentCtrl, this, {$scope: $scope});
});