Binding a property to application controller

Binding a property to application controller when the instance of application controller is not created

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.0.0/ember.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.min.js"></script>
<div id='dvMyApp'></div>

<script type='text/x-handlebars' data-template-name='sample'>
    {{name}}
</script>

JavaScript

MyApp = Em.Application.create({
    rootElement: '#dvMyApp'
});

MyApp.ApplicationController = Em.Controller.extend({
    userName: 'hohenhiem'
});

MyApp.SampleController = Em.Controller.extend({
    needs: ['application'],
    nameBinding: 'controllers.application.userName'
});

MyApp.SampleView = Em.View.extend({
    templateName: 'sample'
});

MyApp.Router.map(function(){
    this.route('sample',{path: '/'});
});