Each component instance has its own scoped model, providing it isolation from model data for other components and remote collection data.
The most direct way to get data into a component is to pass in a reference or a literal as a view attribute.
<Body:>
<view is="user-list" data="{{users}}" num="{{7}}"></view>
<user-list:>
<ul>
{{each data as #user}}
<li>{{#user.name}}</li>
{{/each}}
</ul>
{{num + 10}}
See view attributes for more information.
There are times when accessing data in the root model is desirable from within the component. This can be achieved both in the template and in the controller.
<index:>
<!-- dynamically look up a user in the users collection -->
{{#root.users[userId]}}
var users = this.model.root.get("users");
var user = users[userId];
// or
var $users = this.model.scope("users");
var user = $users.get(userId);
See the documentation for with blocks to pass in data with an alias.
Next ➔