I am creating a template for showing Select fields in my app. However I have 4 different types of select field. value = id, value = name, value = static\_id and value = static\_name (it's complicated...).

I plan to migrate these to ngOptions if possible in the future, but for now I am attempting to have a single select template, that will handle all 4 types of field.

I currently use an ng-if to show the different 'static' code for a select, but this creates a lot of code that I want to reduce into this single template.

Here's some code:

```
// shows a basic select field where option value = id
<div ng-if="field.type=='select'" class="form-group">
    <select-field></select-field>
</div>

// shows a basic select field where option value = name
<div ng-if="field.type=='select_name'" class="form-group">
    <select-field></select-field>
</div>

// shows a basic select field where option value = static_id
<div ng-if="field.type=='select_static_id'" class="form-group">
    <select-field></select-field>
</div>

// shows a basic select field where option value = static_name
<div ng-if="field.type=='select_static_name'" class="form-group">
    <select-field></select-field>
</div>

```

Here, all the field attributes are identical, except for the generated options. Hence why I want to template this. 

I am attempting to have this single template have another ng-if inside that will detect the field type, from the JSON it reads, and then change the options displayed accordingly, like this (2 of the 4 examples shown):

```
<select 
    name={{field.name}} 
    class="form-control form-field {{relationshipUrl}}"
    id={{field.name}} 
    data-is-autofocus={{field.focus}} 
    data-selectreq={{field.rules.selectreq}} 
    data-showhide={{field.rules.showhide}}
>
    <option value="" selected>Please select...</option>
    <span ng-if="field.type=='select'">     
        <option 
            value={{option.id}} 
            ng-repeat="option in cache[field.relationshipURL] | orderBy:'name || firstName'" 
            ng-selected="formData[field.name] == option.id">
                {{option.name || option.firstName}}
        </option>
    </span>
    <span ng-if="field.type=='select_static_name'">
        <option 
            value={{option.name}} 
            ng-repeat="option in cache[field.relationshipURL] | orderBy:'name'"
            ng-selected="formData[field.name] == option.name">
                {{option.name}}
        </option>
    </span>
</select>

```

Possibly horrible code to use a span within the select, but that's why I am coming to you good people. Currently this works in that it shows the correct options, however, it shows the options listed out twice, and I assume it will list them 4 times once all the option types are included. I hope that makes sense. Thanks in advance.