使用ember.js突出显示导航栏中的当前项目

Question

我正在尝试突出显示导航栏中的当前项目。这是我的路由器：

App.Router = Em.Router.extend({
    enableLogging: true,
    location: 'hash',
    root: Em.Route.extend({
        // EVENTS
        gotoList: Ember.Route.transitionTo('list'),
        gotoAbout: Ember.Route.transitionTo('about'),
        // STATES
        list: Em.Route.extend({
            route: '/list',
            connectOutlets: function(router, context) {
                router.get('applicationController').connectOutlet('list');
            },
            enter: function(router) {
                $('.active').removeClass('active');
                $('.nav-pills li.list').addClass('active');
            }
        }),
        about: Em.Route.extend({
            route: '/about',
            connectOutlets: function(router, context) {
                router.get('applicationController').connectOutlet('about');
            },
            enter: function(router) {
                $('.active').removeClass('active');
                $('.nav-pills li.about').addClass('active');
            }
        })
    })
});

这不起作用。
也许我使用的函数不正确（"enter"）？ 如何防止"enter"功能重复列表和状态？