I have a select dropdown in template driven forms, whose value is coming dynamically using \*ngFor:

```
<form class="col-md-5 location-seachform" name="loctionForm" #f="ngForm" (ngSubmit)="onSubmit(f);" novalidate  >
   <select class="form-control" name="somename" ngModel >
     <option [value]="ii" [attr.selected]="ii==0 ? '' : null" *ngFor="let loc_crit of objectKeys(somecriteria); let ii= index"> {{somecriteria[loc_crit] }} 
     </option>
   <select>
<button class="btn btn--filled pull-right" type="submit"><span class="btn__copy"><span class="btn__label">Search</span></span></button>
</form>

```

NOw the problem is that both dropdown and the object I am console-logging on click of the submit button is not showing the default value of the select, even though I have used 

`[attr.selected]="ii==0 ? '' : null"` 

and the first option is showing in the chrome debugger as selected, but still, the first option is not selected by default. The object showing on the click of the submit button is also not showing the default value. The object is like this:
`{somename:''}`

whereas it should come as 
`{somename:'firstValue'}`