Transclude custom options inside directive with 'select' element

Question

I have a somewhat generic directive that consists on a select with a set of options loaded (and later cached) via ajax.

The thing is that I need to specify some specific options depending on where this directive is being used. I was thinking I could transclude such options like this:

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

with the directive being:

{
            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;
                    });
            }
        }

But the custom options won't show up in the select element. Am I missing something? is this possible in some way or another?

Answer 1

Apparently the ng-include tag conflicts in some way with angular's select directive, so the workaround I ended up using was including an optgroup with the ng-transclude attribute, which luckily it worked:

...
template:[
                '<select class="tipos" ng-model="ngModel">',
                    '<optgroup ng-transclude></optgroup>',
                    '<optgroup>',
                        '<option ng-selected="::ngModel === item.tipo" ng-repeat="item in ::tiposDoc track by item.tipo" value="{{::item.tipo}}" title="{{::item.tipoydesc}}">',
                            '{{::item.tipoydesc}}',
                        '</option>',
                    '</optgroup>',
                '</select>'
            ].join(''),
...

Maximus answer worked pretty well too, but I couldn't make some functionality work together with the custom options.