Within my application, there are various projects each with their own set of actions or buttons such as like, share, and edit. However, not all users should have access to every action. In fact, some users should not even see certain buttons.
To address this issue, we have implemented a system where the server returns an array of actions as strings. For example:
["updateLike","editProject","withdraw"]In our template, we iterate through this array using *ngFor directive to display the buttons:
<button *ngFor="let action of allowedActions"> {{ action }} </button>
While this successfully displays the actions, we still need to determine how to execute these actions onclick. What is the proper syntax for this task? Should we consider using a mapper? Additionally, we may extend the array to include multilingual button texts in the future.