The reason I wrote my previous post explaining my difficulties with selects was because I am currently using the excellent Smart Table angular module to bring some interactivity to tables in a project I’m working on. Smart Table seems to just work although I still find the st-table and st-safe-src attribute requirements a little strange.

One issue I have found is with filtering. The following does not filter properly (doesn’t filter anything), even though the option values seem to be set correctly:

<select st-search="field" st-input-event="change" st-delay=0 ng-model="dummy" class="form-control input-sm" ng-options="item.field as item.field for item in items track by item.field">
                    </select>

Instead, you have to write out the select using an ng-repeat which seems to do the trick nicely:

                    <select st-search="field" st-input-event="change" st-delay=0 ng-model="dummy" class="form-control input-sm">
                        <option value="">
                            All items
                        </option>
                        <option ng-repeat="item in items" value="{{ item.field }}">
                            {{ item.field }}
                        </option>
                    </select>

So I just spent 10 minutes trying to figure out why the following wasn’t working in AngularJS:

<select ng-options="item.name for item in items">
</select>

I spent ages checking my syntax and that the data was correct. Finally I discovered the reason – <select REQUIRES ng-model.

<select ng-model="dummy" ng-options="item.name for item in items">
</select>

works just fine…