Angular select, get another value as option when empty

Question

Here is my code:

<select id="storeSelectBox" ng-model="model.store" ng-options="store.name for store in model.stores[model.retailer.shortName]" ng-change="retailerSelected()"></select>

My issue is following: since 'store.name' is not mandatory it can be emtpy and select shows empty items. Is there any possibility to get 'store.shortName' only when 'store.name' is empty? Would be great to modify somehow ng-options expression without touching controller. Thanks in advance for help.

show both then use ng-if to leverage showing only one?

CodeSmith
– CodeSmith

2017-10-04 09:01:01 +00:00
Commented Oct 4, 2017 at 9:01 — CodeSmith
– CodeSmith, Commented Oct 4, 2017 at 9:01

Venkat · Accepted Answer · 2017-10-04 08:55:55Z

2

You can try this,

<select id="storeSelectBox" ng-model="model.store" ng-change="retailerSelected()">
    <option ng-repeat="store in model.stores[model.retailer.shortName]" ng-value="store">
        <span ng-if="store.name">{{store.name}}</span>
        <span ng-if="!store.name">{{store.shortName}}</span>
    </option>
</select>

It will show shortName if name is empty, still entire store object will be assigned to model.store

answered Oct 4, 2017 at 8:55

Venkat

2652 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Michal Cholewiński Over a year ago

It works partially. It shows items as expected, but when I will choose any option it's not shown in select as a choosen.

Venkat Over a year ago

It should just work fine, you maybe changing the value of model.store in ng-change function

Collectives™ on Stack Overflow

Angular select, get another value as option when empty

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related