Advanced Model Binding
The scale bar component displays information about a particular map. More specifically, it is dependent on the data of a map model to display its values.
Components express this data dependency through interactions through injecting the MapView.
The specific map view that is injected is resolved through a model binding based on the layout hierarchy.
Nested Model Imports
In previous layout examples, layouts were shown where components related to a map, such as zoom buttons, were nested within a map. It was assumed that the component would bind to the map it was placed in, but why?
Certain components, such as <zoom/> or <geolocate/>, require a Map Model to function. To locate a Map Model, the layout tree hierarchy will be searched upwards, starting at the requesting component. When a element in the layout is found that provides the required model, (in this case, the <map/> component provides a Map Model), the requesting component will import the model. If the correct model is not found on an upwards search, a breadth first search will be performed from the root of the layout tree.
Take this more complicated layout for example.
This layout has components such as <search/> or <gxm:add-feature/> which require the context of a specific map to function. However, these components are not nested within the <map/> component in the app. Therefore, they will start a breadth first search to discover a map model import it.