title: Passing a binding to transcluded scope in component
body: <p>In AngularJS 1.5, I want to pass a binding from a component into the (multi-slot) transcluded scope - for a reference in the template (in either one specific or all of them - no either way is fine). </p>
  
  <p>This is for creating a generic custom-select list </p>
  
  <pre><code>// Component
  .component('mySelect', { 
     bind: { 
         collection: '&lt;'
     },
     transclude:{
        header: 'mySelectHeader',
        item: 'mySelectItem'
     },
     templateUrl: 'my-select-template',
     controller: function(){
         ..... 
     }
  });
  
  ...
  // Component template
  &lt;script id="my-select-template" type="text/ng-template"&gt;
  &lt;ol&gt;
    &lt;li ng-transclude="header"&gt; &lt;/li&gt;
    &lt;li ng-transclude="item"
        ng-click="$ctrl.select($item)"
        ng-repeat"$item in $ctrl.collection"&gt;
    &lt;/li&gt;
  &lt;/ol&gt;
  &lt;/script&gt;
  
  ...
  // Example usage
  &lt;my-select collection="[{id: 1, name: "John"}, {id: 2, name: "Erik"}, ... ]&gt;
     &lt;my-select-head&gt;&lt;/my-select-head&gt;
  
     &lt;!-- Reference to $item from ng-repeate="" in component  --&gt;
     &lt;my-select-item&gt;{{$item.id}}: {{$item.name}}&lt;/my-select-item&gt;
  
  &lt;/my-select&gt;
  </code></pre>
  
  <p>Is this possible from a <code>.component()</code>? with custom-directives for the <code>transclusion</code> ?</p>