Используйте фильтр для ng-options, чтобы изменить отображаемое значение.

У меня есть массив цен (0, 0.99, 1.99... и т.д.), который я хочу отобразить в <select>.

Я хочу использовать Angular ng-options как этот

<select ng-model="create_price" ng-options="obj for obj in prices"/>

Как показано выше, он будет генерировать выбор 0, 0.99, 1.99...

Но я хочу использовать фильтр в коде так, чтобы каждый раз, когда было представлено слово "цены" (или что-то в этом роде), код запускает функцию для изменения чисел с плавающей запятой на строки и представления (free, 0.99$, 1.99$... и т.д.).

Есть ли способ сделать это?

Спасибо

Ответы

Ответ 1

Там лучший способ:

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

Затем используйте его следующим образом:

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

Таким образом, фильтр полезен для одиночных значений, а не для работы только с массивами. Если у вас есть объекты и соответствующие фильтры форматирования, это весьма полезно.

Фильтры также могут использоваться непосредственно в коде, если они вам понадобятся:

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

Ответ 2

Вы хотите создать настраиваемый фильтр, например:

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

используйте его как:

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

Ответ 3

Измените псевдокод

data-ng-options="( obj.property | myFilter ) for obj in objects"

app.filter('myFilter', function() {
  return function(displayValue) {
    return (should update displayValue) ? 'newDisplayValue' : displayValue;
});