Ember.js: assign active class to element that matches the current route

Using Ember, I'd like to render a non-clickable set of breadcrumb elements. For example, I'd like to show the user which step they're on as part of a 3 step process. Something like this:

Step 1 | Step 2 | Step 3

I'd like the currently active step to have an active class on it. I can accomplish this by doing something like this:

{{#link-to "step1" tagName="div"}}Step 1{{/link-to}}

The problem with this approach though, is that Step 1 becomes clickable and I don't want it to be clickable. Any way to achieve this using Ember's built-in mechanisms?