select tag has no option

Question

In my angular2 app, I have tried to set option of the a select tag using an array in a component.

Here is the select tag:

 <select 
                class="form-control" 
                ngControl="frequency" 
                #frequency="ngForm" 
                required>
                <div *ngFor="#f of frequencies">
                    <option >{{f}}</option>
                </div>
            </select>

Iand here is the component:

export class FormComponent{

    frequencies=['aaa','bbb','ccc'];

}

The problem, when the page get loaded it has none of these option?

Answer 1

Put the *ngFor on the <option> element and remove the <div>

        <select 
            class="form-control" 
            ngControl="frequency" 
            #frequency="ngForm" 
            required>
                <option *ngFor="#f of frequencies">{{f}}</option>
        </select>

In recent Angular2 versions it should be

        <select 
            class="form-control" 
            ngControl="frequency" 
            #frequency="ngForm" 
            required>
                <option *ngFor="let f of frequencies">{{f}}</option>
        </select>

(let instead of #)