Javascript AngularJS中的继承和嵌套视图

我正在尝试在angularjs中设置一些嵌套视图。我一直在使用图书馆来做这件事，这在很大程度上非常有效。问题是每个视图都有一个单独的控制器，它们之间没有真正的继承。如果我想从子控制器修改父控制器中的某些内容，我必须使用$scope.$parent。这有点痛苦，如果存在多个继承级别，并且您必须记住您正在访问的变量处于哪个级别，则情况可能会变得更糟。此外，如果您忘记在子控制器中使用$parent，并且尝试修改父变量之一，Angular将创建该变量的新实例，这可能会导致一些难以跟踪的错误

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

有人能想到这个解决方案或更好的解决方案有什么问题吗？使用$parent并让Angular handel继承遗产会更好吗

---

谢谢

如果稍微修改源代码，您应该能够启用protypal继承

打开文件./ui router/src/viewDirective.js，您会在顶部附近找到：

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

添加另一行内容如下：

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

这将启用继承。

---

我在这方面找不到一个好的直接源代码，但它充满了各种角度的优点。

如果稍微修改源代码，您应该能够启用protypal继承

打开文件./ui router/src/viewDirective.js，您会在顶部附近找到：

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

添加另一行内容如下：

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

这将启用继承。

---

我在这方面找不到好的直接来源，但它充满了各种角度的优点。

正如John指出的那样，$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移动到基础原型中，我可以使用标准原型继承。

正如John指出的，$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移动到基本原型中，我可以使用标准原型继承。

这很有效，尽管“控制器作为”语法的效果不太好。例如，如果在我的模块配置中有“controller:“myChildCtrl as ctrl””，那么我无法通过“this”访问父作用域。e、 g.如果“this.someParentVariable=3”，这将不起作用。但是，这将在“$scope.ctrl.someParentVariable=3”中起作用。对于继承如何工作，存在一些混淆$作用域是控制器使用的对象，它们相互继承，而不是控制器。当控制器放置在DOM元素上时，该元素上的$scope通常继承自祖先DOM元素上的$scopes，控制器与此无关。据我所知，使用“controllerasctrl”语法实际上将控制器的引用放在当前作用域上。这与您在控制器的构造函数中引用的对象“This”相同。“controller as”语法被一些人（包括我）认为是有害的。如果希望控制器实例具有公共功能或实例变量，但两个实例仍不共享相同的作用域，则可以如上所述执行原型继承。您应该使用服务在控制器实例之间共享数据。尽管“控制器作为”语法不太适用，但这种方法仍然有效。例如，如果在我的模块配置中有“controller:“myChildCtrl as ctrl””，那么我无法通过“this”访问父作用域。e、 g.如果“this.someParentVariable=3”，这将不起作用。但是，这将在“$scope.ctrl.someParentVariable=3”中起作用。对于继承如何工作，存在一些混淆$作用域是控制器使用的对象，它们相互继承，而不是控制器。当控制器放置在DOM元素上时，该元素上的$scope通常继承自祖先DOM元素上的$scopes，控制器与此无关。据我所知，使用“controllerasctrl”语法实际上将控制器的引用放在当前作用域上。这与您在控制器的构造函数中引用的对象“This”相同。“controller as”语法被一些人（包括我）认为是有害的。如果希望控制器实例具有公共功能或实例变量，但两个实例仍不共享相同的作用域，则可以如上所述执行原型继承。您应该使用服务在控制器实例之间共享数据。