【问题标题】:How to use an angularJs filter on items label within ng-options如何在 ng-options 中的项目标签上使用 angularJs 过滤器
【发布时间】:2014-05-02 21:39:09
【问题描述】:

给定一个加载了产品选项的选择列表,我希望标签的格式为选项名称,然后是括号中的价格。例如:“产品选项 B ($1,432.12)”。我的选项对象具有属性“名称”和“价格”。价格是数字,我希望它使用货币过滤器格式化。我该怎么做?我在想也许是一个接受字符串和数值的自定义过滤器。只是不确定如何在 ng-options 中应用过滤器。

以下代码只显示名称(而非价格):

<select class="form-control"
        ng-model="selectedOption"
        ng-options="option.name for option in category.options"></select> 

【问题讨论】:

  • 你不能在控制器/指令中用 displayName 属性来装饰你的模型吗?

标签: angularjs ng-options angularjs-ng-options


【解决方案1】:

这应该适合你:

<select class="form-control"
    ng-model="selectedOption"
    ng-options="option.name + ' (' + (option.price | currency:'USD$') + ')' for option in options">
</select>

这将呈现一个下拉菜单,其中包含以下形式的项目:Item A (USD$14.00)

http://jsfiddle.net/6MYc3/

【讨论】:

  • 这很完美,但我有一个问题。我有一些选项,我想像 code - desc 这样显示。但我的选择之一是code=""desc="",结果我得到" - ",但我只想留空""。请问我怎样才能做到这一点?
  • 哦,我明白了option.code as option.code==='' ? '' : (option.code + ' - ' + option.desc) for option in options
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2016-01-11
  • 1970-01-01
  • 1970-01-01
  • 2020-10-19
  • 2019-01-08
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多