linkTo: className for ancestor routes

[vectart]

Often, an application might have many levels of navigation. And as an user, I would like to see ancestor links highlighted as well as a current link. The problem is that now active className is being assigned only for the current route.

Example: a classes directory.

The routes are:

App.Router.map(function() {
    this.resource('category', { path: ':category_id' }, function () {
        this.resource('subcategory', { path: ':subcategory_id' }, function () {
            this.route('subcategory', { path: ':subcategory_id' });
        });
    });
});

An user visits /computer/programming/javascript/

Unfortunately, now the menus look like that: Language * Computer * Sports Programming * QA * Administration PHP * Python * Javascript

The idea is that the menus should look like that: Language * Computer * Sports Programming * QA * Administration PHP * Python * Javascript

Proposed solution

Implement an ancestor option which would initiate checking for a current route in children resources. If it exists, then ancestor class name should be assigned to that link.

{{linkTo 'category.index' id ancestor='yes'}}Computer{{/linkTo}}

[wagenet]

It will probably be good to discuss this on the Forums to try to build some consensus. Feature requests tend to get limited attention here.

[dierbro]

It worked until RC7 (jsbin) but with RC8 (jsbin) the parent link is not set to active anymore.

[vectart]

It's already fixed today. Thanks @teddyzeenny