Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/453.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 一条路线能否同时激活多次?(非单例控制器)_Javascript_Ember.js_Routes_Ember Router_Outlet - Fatal编程技术网

Javascript 一条路线能否同时激活多次?(非单例控制器)

Javascript 一条路线能否同时激活多次?(非单例控制器),javascript,ember.js,routes,ember-router,outlet,Javascript,Ember.js,Routes,Ember Router,Outlet,我想在Ember JS中创建一个滑动UI,其中新输入路线的视图部分滑动到上一条路线的视图上。一条路线必须能够在不同型号下多次处于活动状态。请参阅本文末尾的示例 我无法将其安装到余烬路由和渲染系统中。它基本上链接到具有随机ID的新配线架布线 我创建了一个containerOutlet帮助程序,它将新视图呈现为ContainerView而不是常规OutletView。这是可行的,但当进入相同的“面板”路径时,它不会创建新的控制器/视图对,而只是更改当前控制器/视图对上的模型 是否可以实例化一个新的控

我想在Ember JS中创建一个滑动UI,其中新输入路线的视图部分滑动到上一条路线的视图上。一条路线必须能够在不同型号下多次处于活动状态。请参阅本文末尾的示例

我无法将其安装到余烬路由和渲染系统中。它基本上链接到具有随机ID的新配线架布线

我创建了一个containerOutlet帮助程序,它将新视图呈现为ContainerView而不是常规OutletView。这是可行的,但当进入相同的“面板”路径时,它不会创建新的控制器/视图对,而只是更改当前控制器/视图对上的模型

是否可以实例化一个新的控制器/视图对,并将其“呈现”到ContainerView出口中

我觉得余烬不是为这个而设计的,我反对这个系统,所以任何提示或澄清都会很有帮助


示例

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

App = Ember.Application.create({});

App.Router.map(function () {
    this.route("panel", {
        path: "/:panel_id"
    });
});

App.IndexRoute = Ember.Route.extend({
    model: function () {
        random = getRandomInt(1, 10);
        return { nextPanelId: random };
    }
});

App.PanelRoute = Ember.Route.extend({
    model: function (params) {
        random = getRandomInt(1, 10);
        return {
            id: params.panel_id,
            nextPanelId: random
        };
    }
});

Ember.Handlebars.registerHelper('containerOutlet', function (property, options) {
    //(..)
    //Only this line has been changed
    return Ember.Handlebars.helpers.view.call(this, Ember.ContainerOutletView, options);
});

Ember.ContainerOutletView = Ember.ContainerView.extend({
    //For some reason it breaks when I remove this observer
    _currentViewWillChange: Ember.beforeObserver(function () {}, 'currentView'),

    _currentViewDidChange: Ember.observer(function () {
        this.pushObject(this.get('currentView'));
    }, 'currentView')
});
Spotify在他们的网站上做得很有品味。我附上了一些截图来更好地解释它

基本上,当过渡到一个新的路由时,它会被渲染到一个新的“层”中,在上一个路由上滑动。比较和

上一个视图仍然存在,当单击上一个路由时,应用程序将转换回上一个视图。这可以无限次重复,以创建保留“路由”历史的分层UI


代码

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

App = Ember.Application.create({});

App.Router.map(function () {
    this.route("panel", {
        path: "/:panel_id"
    });
});

App.IndexRoute = Ember.Route.extend({
    model: function () {
        random = getRandomInt(1, 10);
        return { nextPanelId: random };
    }
});

App.PanelRoute = Ember.Route.extend({
    model: function (params) {
        random = getRandomInt(1, 10);
        return {
            id: params.panel_id,
            nextPanelId: random
        };
    }
});

Ember.Handlebars.registerHelper('containerOutlet', function (property, options) {
    //(..)
    //Only this line has been changed
    return Ember.Handlebars.helpers.view.call(this, Ember.ContainerOutletView, options);
});

Ember.ContainerOutletView = Ember.ContainerView.extend({
    //For some reason it breaks when I remove this observer
    _currentViewWillChange: Ember.beforeObserver(function () {}, 'currentView'),

    _currentViewDidChange: Ember.observer(function () {
        this.pushObject(this.get('currentView'));
    }, 'currentView')
});