ember router v2.3, controllerFor issue

by inconduit

HTML

<script src="https://github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.min.js"></script>
<script src="http://inconduit.com/src/ember_pre2_398.min.js"></script>
<div class="container" id="app-container">
    
</diV>
    <script type="text/x-handlebars" data-template-name="application">
      {{outlet}}
    </script>
    <script type="text/x-handlebars" data-template-name="index">
      <p>{{#linkTo 'posts'}}Go to Posts{{/linkTo}}</p>
    </script>
    <script type="text/x-handlebars" data-template-name="posts">
      <h2>Posts:</h2> 
      <br>
      <h1 {{action emptyList}}>click to empty via controllerFor (wont work)</h1>
      <br>
      <h1 {{action emptyList2}}>click to empty via global reference (will work)</h1>
      <br>
      {{outlet}}
      
    </script>
<script type="text/x-handlebars" data-template-name="posts/index">     
      {{#each name in controller}}
  		number : {{name}}
  		<br>
       {{/each}}
</script>

JavaScript

App = Ember.Application.create({
  rootElement: "#app-container"
});

App.Router.map(function() {
  this.resource('posts', function() {
    this.route('new', { path : '/new' });
  });
});

App.PostsIndexRoute = Ember.Route.extend({
  setupController : function(controller,model) {
    controller.set('content',['one','two','three']);
    App.postsIndexController = controller;
  }
});

App.PostsController = Ember.Controller.extend({
  emptyList : function() {
    this.controllerFor('postsIndex').set('content',Ember.A());
  },
  emptyList2 : function() {
    App.postsIndexController.set('content',Ember.A());
  }  
});

App.PostsRoute = Ember.Route.extend();

App.PostsIndexController = Ember.ArrayController.extend({
});