Values set in Ember Component not available in nested components

While data passed from a controller to a component can be passed down to a nested component without a problem... E.g:

In template:

{{my-component data=list}}

And inside my-component's template:

{{my-sub-component data=data.item}}

The above works fine. But:

data set inside the parent component doesn't seem to get passed down:

App.MyComponent = Ember.Component.extend({
    willInsertElement: function() {
        this.set('item', 'xyz');

followed by:

{{my-sub-component data=item}}

When I try to access this.get('data') from the sub-component's didInsertElement(), I get nothing.

Using Ember version 1.8.1.

NOTE: Even though my example is in Handlebars for clarity, I'm actually using Emblem.