javascript - Angular : How to show icon. png 取决于项目的属性?

标签 javascript angularjs if-statement angularjs-ng-repeat ng-hide

我有一个如下所示的对象数组:

[{"name":"Steve", "hourly_wage":16, "status":"part-time"},
{"name":"Maria", "hourly_wage":25, "status":"full-time"},
{"name":"Jose", "hourly_wage":21, "status":"former"}]

我想为每个人的就业状态显示一个图标。全职为全圆,兼职为半圆,前者为空圆。我怎样才能在 Javascript/Angular 中做到这一点?我正在考虑 ng-hide 内部的某种 if 语句?

最佳答案

我认为最通用的方法是创建一个映射,然后使用它。

JS:

$scope.statusIconMapping = {"part-time": "half_circle.jpg", 
    "full-time": "full_circle.jpg", 
    "former": "empty_circle.jpg"
};

标记:

<div ng-repeat="employee in employees">
    ...
    <img src="{{statusIconMapping[employee.status]}}" />
</div>

关于javascript - Angular : How to show icon. png 取决于项目的属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34657017/

相关文章:

javascript - OrderBy 日期值,在 Angular JS 中只是字符串

ruby - 如何在 Ruby 类中使​​用 if 语句?

php - 检查文件是否存在于父目录(从根目录)是不可能的?

javascript - NG-Repeat - 不在列表中工作(忍者图像 slider )

javascript - AngularJS 中的切换指令

javascript - Ember.js:查看按键事件监听

Javascript 门面模式从不显示初始设置

Apache 'if' 指令中的正则表达式...这里出了什么问题?

javascript - 将字符串格式更改为剑道网格中的日期

javascript - 使用数组值创建嵌套对象