Within my directive for tables, I have the ability to output values based on specific properties. For example:
<tr ng-repeat="item in table.data">
<td ng-repeat="column in table.columns">
<i ng-if="column.type === 'icon'" class="fa fa-{{column.icon}} fa-2x"></i>
{{item[column.key]}}
</td>
</tr>
This is how the data structure typically looks:
$scope.table = {
columns: [
{key: 'flag', type: 'icon', icon: function (item) { return 'flag'; }},
{key: 'acronym', type: 'desc', title: 'Acronym'},
],
data: {}
};
Each time the directive processes an item in the table data, it generates a new row following the specifications set by the column structure. Sometimes, an icon needs to be displayed, such as an "arrow," and the icon value is simply set to arrow. However, there are situations where the icon needs to be dynamically determined based on the table data. In such cases, I attempt to execute icon as a callback function in the view.
However, when I try something like {{column.icon(item)}}, errors are thrown. Is there a way to successfully execute this callback function from the view?