Как форматировать текст в вариантах для выбора в AngularJS?
У меня есть следующий объект json:
$scope.values = [
{
"id": 2,
"code": "Code 1",
"name": "Sample 1"
},
{
"id": 4,
"code": "Code 2",
"name": "Sample 2"
},
{
"id": 7,
"code": "Code 3",
"name": "Sample 3"
}
];
В теге select у меня есть следующее:
<select name="c_id" ng-options="c.id as c.code for c in values"></select>
Сгенерированные опции выбора:
Code 1
Code 2
Code 3
Можно ли форматировать текст в следующих параметрах?
Code 1 -- Sample 1
Code 2 -- Sample 2
Code 3 -- Sample 3
Или мне просто нужно будет подготовить значения, прежде чем присоединять их к модели?
Любая помощь приветствуется. Спасибо.
Ответы
Ответ 1
Вы можете сделать это, используя этот синтаксис:
ng-options="c.id as (c.code + ' -- '+ c.name) for c in values"
Пример: http://jsfiddle.net/cherniv/6EkL7/1/
Или кому-то может понравиться следующий синтаксис:
ng-options="c.id as [c.code,c.name].join(' -- ') for c in values"
Пример: http://jsfiddle.net/cherniv/6EkL7/2/
Но в некоторых случаях существует рациональность в использовании фильтра, например:
app.filter("formatter",function(){
return function(item){
return item.code+ " -- " + item.name;
}
})
И: ng-options="c.id as c|formatter for c in values"
Пример: http://jsfiddle.net/cherniv/K8572/
Ответ 2
Конечно, вы можете добиться этого, вызвав ng-repeat
для option
,
HTML
<select>
<option ng-repeat="v in values" value="{{v.id}}">
{{v.code}} -- {{v.name}}
</option>
</select>
JS
тот же
Демо Fiddle