'select'要素を含むディレクティブ内でカスタムオプションを継承する

Question

ajaxを介してロードされた（そして後にキャッシュされる）オプションのセットで構成されるselectに幾分一般的なディレクティブがあります。

このディレクティブがどこで使用されているかによって、いくつかのオプションを指定する必要があります。ディレクティブされた状態で

<select-directive ng-model="model"> 
    <option value="x">custom option</option> 
</select-directive> 

：

{ 
      restrict: 'E', 
      scope:{ 
       ngModel: '=' 
      }, 
      transclude:true, 
      template:[ 
       '<select class="tipos" ng-model="ngModel">', 
        '<ng-transclude></ng-transclude>', 
        '<option ng-selected="ngModel === item.tipo" ng-repeat="item in ::tiposDoc track by item.tipo" value="{{::item.tipo}}" title="longer description">', 
         'description', 
        '</option>', 
       '</select>' 
      ].join(''), 
      link: function(scope){ 
       $http.get('viewApp/viewCtrl.php/getTipos',{cache:true}) 
        .then(function(response){ 
         var resp = response.data; 
         if(!resp.success){ 
          console.log(resp.log); 
          alert(res.msg); 
          return false; 
         } 
         scope.tiposDoc = resp.result; 
        }); 
      } 
     } 

しかし、カスタムオプションを選択要素に表示されません私はこのようなオプションをtransclude可能性が考えていました。何か不足していますか？これは何らかの形で可能ですか？

Answer 1

どうやらng-includeタグの競合、私は使用して終了この問題を回避するには、幸運にもそれng-transclude属性を持つoptgroup、を含むました仕事：

Maximusの回答もうまくいきましたが、カスタムオプションと一緒に機能するようにはできませんでした。

Answer 2

あなたはこのようにそれを行うことができます。角度のselectディレクティブを使用して何らかの方法で

link: function(scope, element, attrs, ctrls, transclude){ 
    var html = transclude(); 
    element.find('select').append(html); 
}