如何根据条件在 angular ui-grid 单元格中显示字形?
How to display a glyphcon in the angular ui-grid cell based on condition?
我有一个 angular UI-网格。在这里,如果特定场景在数据库中有 Is_Locked='T',则必须在名为 'Scenario name' 的列中显示锁定字形。
为此,我调用了如下所示的方法。此方法 returns 所需的单元格模板。但是,它会显示为纯文本,不会转换为 html.
请提出想法。
全局外部范围方法:
$scope.globalExternalScope = {
BaselineLock: function (row) {
if (row.entity.Is_Locked == 'T') {
$scope.template = '<a ng-href="#/newScenario/">{{row.entity.Scenario_Name}}</a><span class="glyphicon glyphicon-calendar"></span>';
return $scope.template;
}
else {
$scope.template = '<a ng-href="#/newScenario/">{{row.entity.Scenario_Name}}</a>';
return $scope.template;
}
}
}
从单元格模板调用方法:
CellTemplate:{{'<div>{{getExternalScopes().BaselineLock(row)}}</div>'}};
是的,我不认为你可以那样做,虽然你的 cellTemplate 确实引用了 getExternalScopes 这不是你的对象的名称,所以也许这就是问题。即使这是问题所在,这也是一个更简洁的解决方案,不需要您进行不必要的调用。
您应该能够完全删除 BaselineLock() 检查并在您的 gridOptions
中将以下行添加到 columnDefs:
cellTemplate:
'<div class="ui-grid-cell-contents"><a ng-href="#/newScenario/">{{row.entity.Scenario_Name}}</a><span ng-if="row.entity.Is_Locked == \'T\'" class="glyphicon glyphicon-calendar"></span></div>'
我没有你的确切代码,所以我无法对此进行测试,但在将这种样式用于字体超棒的图标之前我已经做了类似的事情并且它工作得很好。
我有一个 angular UI-网格。在这里,如果特定场景在数据库中有 Is_Locked='T',则必须在名为 'Scenario name' 的列中显示锁定字形。
为此,我调用了如下所示的方法。此方法 returns 所需的单元格模板。但是,它会显示为纯文本,不会转换为 html.
请提出想法。
全局外部范围方法:
$scope.globalExternalScope = {
BaselineLock: function (row) {
if (row.entity.Is_Locked == 'T') {
$scope.template = '<a ng-href="#/newScenario/">{{row.entity.Scenario_Name}}</a><span class="glyphicon glyphicon-calendar"></span>';
return $scope.template;
}
else {
$scope.template = '<a ng-href="#/newScenario/">{{row.entity.Scenario_Name}}</a>';
return $scope.template;
}
}
}
从单元格模板调用方法:
CellTemplate:{{'<div>{{getExternalScopes().BaselineLock(row)}}</div>'}};
是的,我不认为你可以那样做,虽然你的 cellTemplate 确实引用了 getExternalScopes 这不是你的对象的名称,所以也许这就是问题。即使这是问题所在,这也是一个更简洁的解决方案,不需要您进行不必要的调用。
您应该能够完全删除 BaselineLock() 检查并在您的 gridOptions
中将以下行添加到 columnDefs:
cellTemplate:
'<div class="ui-grid-cell-contents"><a ng-href="#/newScenario/">{{row.entity.Scenario_Name}}</a><span ng-if="row.entity.Is_Locked == \'T\'" class="glyphicon glyphicon-calendar"></span></div>'
我没有你的确切代码,所以我无法对此进行测试,但在将这种样式用于字体超棒的图标之前我已经做了类似的事情并且它工作得很好。