Use filter on ng-options to change the value displayed Use filter on ng-options to change the value displayed angularjs angularjs

Use filter on ng-options to change the value displayed


There's a better way:

app.filter('price', function() {  return function(num) {    return num === 0 ? 'free' : num + '$';  };});

Then use it like this:

<select ng-model="create_price" ng-options="obj as (obj | price) for obj in prices"></select>

This way, the filter is useful for single values, rather than operating only on arrays. If you have objects and corresponding formatting filters, this is quite useful.

Filters can also be used directly in code, if you need them:

var formattedPrice = $filter('price')(num);


You want to create the custom filter such as:

app.filter('price', function() {  return function(arr) {    return arr.map(function(num){      return num === 0 ? 'free' : num + '$';    });  };});

use it like:

<select ng-model="create_price" ng-options="obj for obj in prices | price">  {{ obj }}</select>


Pardon the pseudo code

data-ng-options="( obj.property | myFilter ) for obj in objects"app.filter('myFilter', function() {  return function(displayValue) {    return (should update displayValue) ? 'newDisplayValue' : displayValue;});