BackboneJs:如何在页面标记中引导数据，以及何时将它们分配给集合

So, building an application that uses multiple (2 for now) global collections, it is a catalog of both documents and patients, they have relations, but not as in, 1 document or a list of documents belonging to 1 patient, so they are in fact 2 separate collections,

因此，构建一个使用多个(目前是2个)全局集合的应用程序，它是一个文档和患者的目录，它们有关系，但不像一个文档或一个属于一个患者的文档列表，它们实际上是两个单独的集合，

my app is structured in a module system very similar to how it is described here: http://weblog.bocoup.com/organizing-your-backbone-js-application-with-modules

我的应用程序构建在一个模块系统中，与这里描述的非常相似:http://weblog.bocoup.com/organizing-your-backbone-js-application with-modules

the backbone.js documentation says about bootstrapping, to do something like this,

骨干。js文档中说到引导，要做这样的事情，

<script>
  Accounts.reset(<%= @accounts.to_json %>);
</script>

that is within a Rails application, i would however need to do it differently in asp.net MVC3, most likely i would just print out my json string without the <%= %> which isn't razor view engine style)

在Rails应用程序中，我需要在asp.net MVC3中使用不同的方法，我很可能只打印json字符串而不使用<%= %>，这不是razor视图引擎风格)

but my question here is,

但我的问题是，

this Accounts.reset(...data...); is just floating somewhere in my markup, it is not in any way nicely structured in my module system, isn't there a way to nicely do this? where as i can get the data, from within my module?

这Accounts.reset数据(……);只是在我的标记中浮动，它在我的模块系统中不是很好地结构化，难道没有办法很好地做到这一点吗?我在哪里可以从我的模块中获取数据?

and another side question, suppose i have a route in my backbone app http://example.com/#documents

另一个问题，假设我在我的主干应用http://example.com/#documents中有一条路径

and someone calls this link directly, will my app have the data ready (from the bootstrap) on time, before the route itself is executed?

有人直接调用这个链接，我的应用会不会在路径本身被执行之前(从引导程序)及时准备好数据?

3 个解决方案

#1

I tend to setup application objects - an object that encapsulates all of the code needed to start my application. I then take parameters into that object's constructor, so that they can be used by the app object. Passing pre-loaded JSON data into the app object is one of the things I do, to keep the code sane and encapsulated.

我倾向于设置应用程序对象——一个封装启动应用程序所需的所有代码的对象。然后，我将参数放入对象的构造函数中，以便应用程序对象可以使用它们。将预加载的JSON数据传递到app对象中是我所做的事情之一，以保持代码的正常和封装。

It goes something like this, usually:

通常是这样的:

MyApp = (function(Backbone, _){
  var MyModel = Backbone.Model.extend({});

  var MyCollection = Backbone.Collection.extend({
    model: MyModel
  });

  var MyView = Backbone.View.extend({
    initialize: function(){
      this.collection.bind("reset", this.render, this);
    },

    render: function(){
      // do stuff with the collection here
    }
  });

  var myApp = function(initialModels){
    this.start = function(){
      this.models = new MyCollection();
      this.myView = new MyView({collection: this.models});
      this.models.reset(initialModels);  
    };
  };

  return myApp;
})(Backbone, _);

And then in my page that needs to start up the app, I do this:

然后在我需要启动应用程序的页面中，我这样做:

<script language="javascript">
  var myApp = new MyApp(<%= mymodels.to_json %>);
  myApp.start();
</script>

That's the rails version of course. Just replace the <%= ... %> with your version for the Razor syntax in ASP.NET MVC.

这是rails的版本。仅替换<%=…%>和您的版本在ASP中的Razor语法。净MVC。

#2

if on Rails: in addition to Dericks answer you might want to use Gon to "get your Rails variables in your js".

如果在Rails上:除了Dericks之外，您可能还想使用Gon来“在您的js中获取您的Rails变量”。

then you would initialize your app like that:

然后你可以这样初始化你的应用:

<script language="javascript">
  var myApp = new MyApp(gon.mymodels);
  myApp.start();
</script>

#3

The excellent example from Derick! For MVC 3+ use this syntax:

来自德里克的极好的例子!对于MVC 3+，使用以下语法:

<script language="javascript">
  var myApp = new MyApp( @Html.Raw(Json.Encode(Model)) );
  myApp.start();
</script>

#1