Starting with Angular JS,I have read that components cannot access parent scopes, I mean, each component has its isolated scope. I read this is in order a component can modify its own data and not other components data. This helps to avoid situations where some data from a component can be modified from multiple inner components and would be difficult to resolve a problematic situation with data viewing and find which component is the problematic one.
So later, I read that you can pass in some data to a component with "bindings" from parent components, so the inner component cannot access the parent scope but gets information from the parent scope.So untill here, its ok
But I got surprised when I read that with "binding" in components, you can pass in a "property" by reference, so if in the inner component I modify this property, is not I can access the parent scope, but I am modifying the parent scope, right? So, the problematic situations can happen again, right?
Thanks
While accessing $parent
in isolated scope is clearly an antipattern, this doesn't mean that modifying objects through bindings cannot cause problems.
It depends if parent component should be aware of changes that are made in this object. If it should, then the problem arises, because deep change detection (e.g. with $scope.watch(..., true)
) is costly. In order to avoid this, child component can notify the parent of changes (scope events, &
bindings), or use =
binding with immutable object (the object is never mutated; any change should result in object being copied to a new one).