emberjs : add active css class to link based on current route

I am using Ember version 1.8 . Does anyone know how to automatically highlight menu link when user is in that route. Plese help. I saw few Stack overflow posts on doing it. but they looks old and is not working for me

I have the following menu in handlebars template

    <ul class="nav navbar-nav">
                <li>
                {{#link-to 'posts'}}Posts{{/link-to}}
                </li>
                <li>
                {{#link-to 'comments'}}Comments{{/link-to}}
                </li>
            </ul>

router.js looks like

   this.resource('post', { path: 'posts/:post_id'},function(){
            this.resource('comments', { path: '/comments' });

    });