как я могу разделить атрибуты родительской директивы с ребенком директивы

Question

, если вы посмотрите на http://jsfiddle.net/Zuriel/fdrtpjgd/

мой вопрос, как я могу передать атрибут из родительской директивы в директиве ребенка вложенной.

предполагая, что родитель и ребенок является <container><insides></insides></container>

, если вы посмотрите на моей скрипке, вы увидите, что ребенок нуждается в некоторой области видимости помощи. если я использую $ scope, тогда я получаю пропуск, но его та же область для каждой директивы, что плохо. но если я использую область действия, то она работает внутри каждой директивы, но родительский атрибут не проходит. Мне нужен компилятор? пройти и скомпилировать? или я могу сделать это со ссылкой, и я просто что-то пропустил.

app.directive('container', function() { 
    return { 
     restrict: 'EA', 
     replace: true, 
     transclude: true, 
     $scope: { 
      passthrough: '@' 
     }, 
     link: function($scope, element, attrs) { 
      $scope.passthrough = attrs.greeting; 
      console.log($scope.passthrough); 
     }, 
     template: '<div class="container">{{passthrough}} <div ng-transclude></div></div>' 
    } 
}); 

app.directive('insides', function() { 
     return { 
     restrict: 'EA', 
     replace: 'true', 
     require: '^container', 
     transclude:true, 
     //template: '<div class="insides">{{passthrough}} <span ng-transclude></span></div>' 
     template: function ($scope) { 
      console.log($scope.passthrough); 
      return '<div class="insides">{{ passthrough }} <span style="color:red" ng-transclude></span></div>'; 
    }, 
    } 
}); 

Answer 1

Следуйте ответ здесь, я думаю, что это поможет вам

http://jsfiddle.net/Wijmo/MTKp7/

и некоторые примеры кода здесь

angular.module("btst", []). 
directive("btstAccordion", function() { 
    return { 
     restrict: "E", 
     transclude: true, 
     replace: true, 
     scope: {}, 
     template: 
      "<div class='accordion' ng-transclude></div>", 
     link: function (scope, element, attrs) { 

      // give this element a unique id 
      var id = element.attr("id"); 
      if (!id) { 
       id = "btst-acc" + scope.$id; 
       element.attr("id", id); 
      } 

      // set data-parent on accordion-toggle elements 
      var arr = element.find(".accordion-toggle"); 
      for (var i = 0; i < arr.length; i++) { 
       $(arr[i]).attr("data-parent", "#" + id); 
       $(arr[i]).attr("href", "#" + id + "collapse" + i); 
      } 
      arr = element.find(".accordion-body"); 
      $(arr[0]).addClass("in"); // expand first pane 
      for (var i = 0; i < arr.length; i++) { 
       $(arr[i]).attr("id", id + "collapse" + i); 
      } 
     }, 
     controller: function() {} 
    }; 
}). 
directive('btstPane', function() { 
    return { 
     require: "^btstAccordion", 
     restrict: "E", 
     transclude: true, 
     replace: true, 
     scope: { 
      title: "@", 
      category: "=", 
      order: "=" 
     }, 
     template: 
      "<div class='accordion-group' >" + 
      " <div class='accordion-heading'>" + 
      " <a class='accordion-toggle' data-toggle='collapse'> {{category.name}} - </a>" + 

      " </div>" + 
      "<div class='accordion-body collapse'>" + 
      " <div class='accordion-inner' ng-transclude></div>" + 
      " </div>" + 
      "</div>", 
     link: function (scope, element, attrs) { 
      scope.$watch("title", function() { 
       // NOTE: this requires jQuery (jQLite won't do html) 
       var hdr = element.find(".accordion-toggle"); 
       hdr.html(scope.title); 
      }); 
     } 
    }; 
}) 

Answer 2

опечатка:

$scope: { 
     passthrough: '@' 
    }, 
    link 

удалить го символ e '$'; и вам не нужно назначать из attrs.greeting.

... закомментировать ...

 link: function($scope, element, attrs) { 
      //$scope.passthrough = attrs.greeting; 
      console.log($scope.passthrough); 
     }, 

должны работать