1

我正在尝试在 angularjs 中设置一些嵌套视图。我一直在使用ui-router库来执行此操作，这在大多数情况下都非常有用。问题是每个视图都有一个单独的控制器，它们之间没有真正的继承。如果我想从子控制器修改父控制器中的某些内容，我必须使用 $scope.$parent 。这有点麻烦，如果有多个继承级别，并且您必须记住您正在访问的变量位于哪个级别，它可能会变得更糟。此外，如果您忘记在子控制器中使用 $parent 并尝试修改父变量之一，Angular 将创建该变量的新实例，这可能会导致一些难以追踪的错误。

理想情况下，我只能使用原型继承。这也可以很好地映射到 Typescript 或 Coffeescript 中的类。我想到的一种方法是摆脱所有的父控制器，只让子控制器继承原型（超类）的任何通用功能。然后，您只需将控制器放在 $rootScope 上，以便父视图可以访问它。

谁能想到这个解决方案或更好的解决方案有什么问题？我最好只使用 $parent 并让 Angular 处理“继承”。

谢谢

4

2 回答 2

1

如果您稍微修改源，您应该能够启用原型继承。

打开文件 ./ui-router/src/viewDirective.js 你应该在顶部附近找到这个：

var directive = {
    restrict: 'ECA',
    terminal: true,
    transclude: true,
    ...

添加另一行，使其显示为：

var directive = {
    restrict: 'ECA',
    terminal: true,
    transclude: true,
    scope: true,
    ...

这应该启用继承。我找不到一个好的直接来源，但是这个你管的播放列表充满了各种角度的优点。

于 2013-08-28T19:14:12.783 回答
0

正如约翰指出的那样， $scope 对象相互继承，但实际的控制器却没有。所以我决定设置它，以便控制器相互继承。为此，我有一个看起来像这样的根控制器：

function rootCtrl($scope) {
    $scope.ctrl={};
    $scope.ctrl.scope = $scope;
}

然后在我嵌套最深的子控制器中，我有这样的东西

function myCtrl($scope, $dependency1, $dependency2) {
    myCtrlImpl.apply($scope.ctrl, [$http, $dependency1, $dependency2]);
}

function myCtrlImpl($dependency1, $dependency2) {
    this.someVariableThatIsAccessableEverywhere = ":)";

    //If I want to access scope from here I can just do something like
    //this.scope.$watch...
}

现在，如果我想将任何功能从 myCtrlImpl 移动到基本原型中，我可以使用标准原型继承。

于 2013-08-29T20:35:05.853 回答