Insert directives in HTML in AngularJS?

I am new to AngularJS and trying to find an Angular way.
I am currently working on an application that has various functions that register with the Angular service named FeatureRegistry. From there, they are taken and inserted into the side panel of FeatureSelectionController. By clicking on a function, you should call the function of the startFeature()corresponding function, after which this function should be added to the main view (but where should this DOM manipulation take place?).

So my question. What is the best way (Angular's way) to add directives to the DOM, I don’t necessarily want to use jQuery for this (and also want to limit the use of $ compile, $ watch, etc.).

Directives in mainView can have an isolated scope because functions perform actions that are independent of each other (the data they share is encapsulated in Angular services).

Here is an image

What will be the way Angular inserts directives?

I always read that manipulations with the DOM should only happen in directives, but in the documents, as well as in other issues, I did not find a way to do this.

+5
source share
1 answer

Here is a quick demo: http://plnkr.co/edit/eZTtRVTPb7k9kgS8woKh?p=preview

I don't necessarily see the need for directives here ... unless there are many common functions between the function in the list, the maximum function and the minimized function.

, - :

<feature ng-repeat="f in registry.all()" model="f" state="list">
<feature ng-repeat="f in registry.maximized()" model="f" state="open">
<feature ng-repeat="f in registry.minimized()" model="f" state="minimized">

, , , ng-switch ng-show.

?

+3

All Articles