如果特定路径处于活动状态,我该如何渲染块?

Lux*_*Lux 8 ember.js

如果特定路线处于活动状态,我只想在Ember Handlebars中渲染一个块.那么,我如何创建一个'ifRoute'帮助器,具有与'linkTo'帮助器上的'active'类相同的条件?

我想要这个,因为我有两层导航.因此,如果头部导航点处于活动状态,我只想显示子导航.我不想使用'active'类,因为我使用延迟加载,我只想在头部导航点处于活动状态时加载子导航.

所以,我想做的是:

<ul>
    {{#each assortmentGroups}}
        <li>
            {{#linkTo "assortmentGroup" this}} {{description}} {{/linkTo}}
            {{#ifRoute "assortmentGroup" this}}
                <ul>
                    {{#each itemCategories}}
                        <li>{{#linkTo "itemCategory" this}} {{description}} {{/linkTo}}</li>
                    {{/each}}
                </ul>
            {{/ifRoute}}
        </li>
    {{/each}}
<ul>
Run Code Online (Sandbox Code Playgroud)

我该怎么做或有更好的解决方案?

谢谢

小智 8

只需添加到控制器:

needs: ['application'], 
isCorrectRouteActive: Ember.computed.equal('controllers.application.currentRouteName', 'correctRoute')
Run Code Online (Sandbox Code Playgroud)

同理:

isCorrectPathActive: Ember.computed.equal('controllers.application.currentPath', 'correct.path')
isCorrectURLActive: Ember.computed.equal('controllers.application.currentURL', 'correctURL')
Run Code Online (Sandbox Code Playgroud)

我很确定最新的Ember会做其余的事情


Lux*_*Lux 1

在研究了 linkTo 和 if 助手的 ember 代码、intuitivepixel 的答案以及关于编写我自己的绑定块助手的博客文章之后,我找到了一个解决方案:

var resolveParams = Ember.Router.resolveParams;

var resolvedPaths = function(options) {
    var types = options.options.types.slice(1),
    data = options.options.data;

    return resolveParams(options.context, options.params, { types: types, data: data });
};

Ember.Handlebars.registerHelper('ifRoute', function(name) {
    var options = [].slice.call(arguments, -1)[0];
    var params = [].slice.call(arguments, 1, -1);
    var theResolvedPaths = resolvedPaths({ context: this, options: options, params: params });
    var router = options.data.keywords.controller.container.lookup('router:main');

    var self = this;
    var evaluateIsCurrentRoute = function() {
        self.set('current_route_is_active_bool_for_ifroute', (function() {
            return router.isActive.apply(router, [name].concat(theResolvedPaths)) ||
                router.isActive.apply(router, [(name + '.index')].concat(theResolvedPaths));
        })());
    };

    evaluateIsCurrentRoute();
    router.addObserver('url', evaluateIsCurrentRoute);

    options.contexts = null;

    return Ember.Handlebars.helpers.boundIf.call(this, 'current_route_is_active_bool_for_ifroute', options);
});
Run Code Online (Sandbox Code Playgroud)