How to create a dynamic menu in AngularJS?

Question

JavaScript

Repetition is the mother of learning.
1. I create the ngDynamicMenu directive. The directive is designed to absorb all the logic associated with the display. Therefore, the directive will create a button-group container and fill it with buttons according to the date received from the model. That is, in html -

<ng-dynamic-menu ng-model="MenuModel.getData()"></ng-dynamic-menu>

1.1 a bit of discussion about the " template " directive. At first I wanted to do something like -
template: <div id="button-group"></div>
but then I thought about what angular itself provides us. It provides jqLite in directive with its foud method which selects by tag name. It turns out that if I select a div, then in the future I can forget about it and add "something" to the div when expanding, then it will take and select not just one object, but an array. This is what prompted me to think that if containers are used, then they themselves must be directives with unique names. And if so, then the directive itself will be the container.
3. I also thought that ng-model is superfluous, as it serves for data binding and validation and the like. This leaves me open to the question of how to get the json directive, but I can only assume that the best option would be to pass a link that I will download using the "download service".
4. If I am here, then the menu is already working and the first click that the handler received in the directive does not know what to do with it.

element.bind('clicck', ()=>{});
Не знает по тому, что эти клики предназначаются параллельно лежащий директиве. Опять таки клик я могу доставить туда либо при помощи общего контроллера, либо при помощи сервиса.  Как будет лучше?

Answer 1

You have written your vision of the directive. What exactly is the question? )