Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/backbone.js/2.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 Backbone.js路由取决于型号值_Javascript_Backbone.js_Url Routing - Fatal编程技术网

Javascript Backbone.js路由取决于型号值

Javascript Backbone.js路由取决于型号值,javascript,backbone.js,url-routing,Javascript,Backbone.js,Url Routing,我有一个像这样的收藏 [ { "year": 1868, .... ] }, { "year": 1872, .... }, { ... } ] 有没有办法用“/year/:year:”year”或“/:year:”year”设置路线 我曾尝试在主应用程序视图中创建一个查找表,将年份索引传递给模型视图。我试过使用u.map、u.each、u.pu

我有一个像这样的收藏

[
    {
        "year": 1868,
        ....
           ]
    },
    {
        "year": 1872,
        ....
    },
    {
        ...
    }
]
有没有办法用“/year/:year:”year”或“/:year:”year”设置路线

我曾尝试在主应用程序视图中创建一个查找表,将年份索引传递给模型视图。我试过使用u.map、u.each、u.pull和u.where,但我想我一定做错了什么

是一个非主干视图,它看起来像什么。所以导航到/:year将直接转到该年,它对应于一个模型指数

编辑:为了澄清,基本上我希望用户能够转到/year/:year,但是:year值对应于上面提到的某个模型。在本例中,转到/year/1868,将渲染上述集合中的第一个模型

编辑2:以下是我的应用程序的外观

这是路由器 var router=Backbone.router.extend{ 路线:{ :“根”, “年/:年”:“年” },

    root: function() {
        new App();
    },

    year: function(year) {
        new App({
            year: year
        });
    }
});
它调用这个文件

define(['backbone', 'assets/js/collections/elections.js', 'assets/js/views/election.js', 'jqueryui'], function(Backbone, Elections, ElectionView, simpleSlider) {
var AppView = Backbone.View.extend({
    current_election_index: 0,
    active_btn_class: 'dark_blue_bg',
    wiki_base: 'http://en.wikipedia.org/wiki/United_States_presidential_election,_',
    started: 0,
    el: 'body',
    playback: {
        id: '',
        duration: 1750,
        status: false
    },

    initialize: function() {
        elections = new Elections();
        _.bindAll(this, 'render');
        this.listenTo(elections, 'reset', this.render);
        elections.fetch();
        this.remove_loader();
    },

    render: function () {
        if (this.started === 0) {
            this.election_year();
        }
        var view = new ElectionView({
            model: elections.at(this.current_election_index),
            election_index: this.current_election_index
        });
        this._make_slider();
        this.update_ui();
        return this;
    },

我拿出了一些方法,因为它们不是必需的。

典型的解决方案如下所示:

var AppRouter = Backbone.Router.extend({
  routes: {
    "year(/:year)" : "electionByYear"
  },

  electionByYear: function(year) {

    //all of your data, wherever you get it from
    var results = this.allElectionResults;

    //if a year parameter was given in the url
    if(year) {
        //filter the data to records where the year matches the parameter
        results = _.findWhere(results, { year: parseInt(year, 10)});
    }

    doSomething(results);

  }
});
基于注释编辑:如果您的视图负责创建集合,则应将上述逻辑移动到视图中,并将年份参数作为参数传递到视图中:

var View = Backbone.View.extend({
  initialize: function(options) {
    this.year = options.year;
  }
});

var view = new View({year:year});
view.render();
或者,如果您使用的是现有视图:

view.year = year;
view.render();

你能试着澄清你的问题吗?从你的解释中分析有点困难。什么是数据?路由器在创建时如何访问集合?现在根路由正在创建视图,然后调用collections.fetch。我尝试了console.logcollection.at0,我得到了undefined@alme1304,对不起,数据不正确只是一个键入错误。我想键入结果。我现在编辑了它。我也不太确定集合的问题是什么,但也为答案添加了一些建议。不确定您希望我将代码放置在哪里,我仍然无法使用u。findWhere,我一直未定义。我还添加了更多代码以清除所有内容