[英]Change Boolean values to text in angular 2 client side
I am trying to get data from api and show into the table on of the column contains status attribute which return true or false value but I want to show on client side Active or Block instead of this. 我试图从api获取数据并在列表中显示包含status属性,该属性返回true或false值但我想在客户端显示Active或Block而不是this。 How can I able to achieve this in angular 2.
我怎样才能在角度2中实现这一点。
I would suggest a pipe that returns either active or blocked according to the boolean. 我建议根据布尔值返回活动或阻塞的管道。
import {Pipe, PipeTransform} from '@angular/core';
@Pipe({name: 'activeBlocked'})
export class ActiveBlockedPipe implements PipeTransform {
transform(value) {
return value ? 'Active' : 'Blocked';
}
}
Then you can use it like this in you components template: 然后你可以在你的组件模板中使用它:
{{value | activeBlocked}}
In my opinion this is the easiest to reuse. 在我看来,这是最容易重用的。
How can I able to achieve this in angular 2
我怎样才能在角度2中实现这一点
Just use javascript/typescript: 只需使用javascript / typescript:
const valueFromServer = false; // Assuming
const toShow = valueFromServer ? 'Active' : 'Blocked';
您可以直接在视图中执行此操作:
<td>{{user.IsActive && 'Active' || 'Block'}}</td>
简单的方法是在td元素中使用条件运算符
<td>{{user.status ? 'Active' : 'Block'}}</td>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.