在UI网angularjs条件电池模板 [英] Conditional cell template in ui-grid angularjs
本文介绍了在UI网angularjs条件电池模板的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
显示 UI网数据时如何添加条件
cellTemplate如下:
How to add conditional when showing data in ui-grid
cellTemplate below:
$scope.status = ['Active', 'Non Active', 'Deleted'];
$scope.gridOptions = {
columnDefs: [{
field: 'code'
}, {
field: 'name'
}, {
field: 'status',
cellTemplate: '<div>{{status[row.entity.status]}}</div>'
}]
};
预期的结果应该是行状态显示活动/非活动/删除
。
下面是 plunker
先谢谢了。
推荐答案
您必须使用 externalScopes
。
在您的标记这样定义gridholder。
In your markup define the gridholder like this.
<div ui-grid="gridOptions" external-scopes="states" class="grid"></div>
和在你的控制器使用该code:
And in your controller use this code:
var statusTxt = ['Active', 'Non Active', 'Deleted'];
$scope.states = {
showMe: function(val) {
return statusTxt[val];
}
};
var statusTemplate = '<div>{{getExternalScopes().showMe(row.entity.status)}}</div>';
$scope.gridOptions = {
columnDefs: [{
field: 'code'
}, {
field: 'name'
}, {
field: 'status',
cellTemplate: statusTemplate
}]
};
或者使用角度滤波器。
Or use an angular filter.
请注意,这仅渲染文本。最好的办法是在UI电网使用它之前转换 myData的
有真正的文本状态。万一你想要做一些基于文本过滤以后。
Note that this only renders text. The best approach would be to transform myData
to have real text states before using it in ui-grid. Just in case you want to do some text based filtering later on.
下面是一个 Plunker
这篇关于在UI网angularjs条件电池模板的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文