Ember js get array index of clicked element in an each loop, and filter with it

I am trying to implement the following:

1. My controller returns an array of posts, which fall into a certain category. I am displaying the titles of each of those posts on the left hand side of the page.
2. On the right side of the page, I would like to display an area where the full text of only one post displays. This would be the first post initially, but would change when a different post title is clicked.

I am currently trying to achieve this using two each helpers in my template:

templates/posts.hbs

<div class='left-section'>
  {{#each categoryOnePosts as |post|}}
    <a {{action 'updateFullText'}}>{{post.title}}</a>
  {{/each}}
</div>
<div class='right-section'>
  {{#each currentPostFullText as |post|}} 
   {{post.full_text}} 
  {{/each}}
</div>

My idea is to for the 'updateFullText' action to get the array index of a post which is is clicked, and then display only the post which matches that index in the right hand section.

controllers/posts.js

categoryOnePosts: function() {
    var allPosts = this.get('posts');
    var categoryOne = posts.filterBy("category", 1);
    return categoryOne;
  }.property("posts.@each"),

  currentPostFullText: function() {
    var currentPostIndex = this.get('currentPostIndex');
    var categoryOne = this.get('categoryOnePosts');
    var thisPost = //Set thisPost to only include the object at position 'currentPostIndex' in the categoryOne array.
    return thisPost;
  }.property("categoryOnePosts', 'currentPost'),

  actions: {
    var clickedPostIndex = //Get the array index of the clicked item.
    this.set('currentPostIndex', clickedPostIndex);
  },

Problem is I can't manage to get the array index of the clicked item. Is it possible to achieve this, or would I need to go about this in a completely different way?