在角度繼承指令

Question

我正在儘量保持我的角度項目儘可能模塊化。我目前有3個嵌套指令構成我的項目的基礎。

最低指令總是具有相同的核心功能和範圍對象，但根據用例需要額外的範圍對象和功能。該應用程序非常大，因此儘可能分離所有內容非常重要，並遵循DRY原則。

在Python風格的OOP中，我會繼承所有的屬性和函數，然後添加到它們。 Angular中有類似的東西嗎？

例如：

基礎

myApp.directive('itemOption', function() { 
    return { 
     restrict: 'E', 
     templateUrl: "item_option.html", 
     scope: { 
      'lowest': '=', 
      'middle': '=', 
      'high': '=', 
      'ngModel': '=', 
     }, 
     controller: function ($scope) { 
      $scope.prop1 = "Default 1" 
      $scope.prop2 = "Default 2" 
     } 
    } 
} 

將被代替基地

myApp.directive('itemOptionVariation1', function() { 
    return { 
     restrict: 'E', 
     templateUrl: "item_option.html", 
     scope: { 
      'lowest': '=', 
      'middle': '=', 
      'high': '=', 
      'ngModel': '=', 
     }, 
     controller: function ($scope) { 
      $scope.prop1 = "Default 1" 
      $scope.prop2 = "Default 2" 

      // Unique to this directive 
      $scope.prop900 = "Penguins" 
     } 
    } 
} 

而另一個

myApp.directive('itemOptionVariation2', function() { 
    return { 
     restrict: 'E', 
     templateUrl: "item_option.html", 
     scope: { 
      'lowest': '=', 
      'middle': '=', 
      'high': '=', 
      'ngModel': '=', 
     }, 
     controller: function ($scope) { 
      $scope.prop1 = "Default 1" 
      $scope.prop2 = "Default 2" 

      // Unique to this directive 
      $scope.prop3 = "This is awesome" 
     } 
    } 
} 

Answer 1

您可以使用重複指令要求：[^ parent_directive1，^ parent_directive2]作爲指令屬性。請檢查下面的例子。

myApp.directive('itemOptionVariation2', function() { 
    return { 
     restrict: 'E', 
     templateUrl: "item_option.html", 
     require: ['^itemOption', '^itemOptionVariation1'], 

這不完全是繼承，而是一種構圖。但是，這已經解決了我的需求。