How to properly bind scope between directive and controller with angularJS

Question

I\'m trying to generate an n-level hierarchical unordered list with anugularJS, and have been able to successfully do so. But now, I\'m having scope issues between the directiv

Answer 1

It may be because each directive creates his own scope (actually you tell them to do so).
You can read more about directives here, especially the chapter "Writing directives (long version)".

scope - If set to:

true - then a new scope will be created for this directive. If multiple directives on the same element request a new scope, only one new scope is created. The new scope rule does not apply for the root of the template since the root of the template always gets a new scope.

{} (object hash) - then a new 'isolate' scope is created. The 'isolate' scope differs from normal scope in that it does not prototypically inherit from the parent scope. This is useful when creating reusable components, which should not accidentally read or modify data in the parent scope.

So the changes you do are not reflected in the MyCtrl scope because each directive has his own 'isolated' scope.

That's why a click only changes the local $scope.itemselected variable and not 'all' of them.