BackboneJs: как я загружаю свои данные в разметку страницы, и когда я назначаю их моим коллекциям

Итак, создавая приложение, которое использует несколько (2 на данный момент) глобальных коллекций, это каталог как документов, так и пациентов, у них есть отношения, но не как в одном документе или списке документов, принадлежащих одному пациенту, поэтому они фактически являются двумя отдельными коллекциями,

мое приложение структурировано в модульной системе, очень похожей на то, как она описывается здесь: http://weblog.bocoup.com/organizing-your-backbone-js-application-with-modules

В документации backbone.js говорится о загрузке, чтобы сделать что-то вроде этого,

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

который входит в состав Rails-приложения, однако мне бы пришлось сделать это по-другому в asp.net MVC3, скорее всего, я просто распечатал бы мою строку json без <% =% > , которая не является стилем просмотра бритвы )

но мой вопрос здесь,

этот Accounts.reset(...data...); просто плавает где-то в моей разметке, он никоим образом не структурирован в моей модульной системе, разве нет способа сделать это? где, как я могу получить данные, из моего модуля?

и другой вопрос, предположим, у меня есть маршрут в моем базовом приложении http://example.com/#documents

и кто-то напрямую вызовет эту ссылку, будет ли мое приложение готово к загрузке данных (из бутстрапа) вовремя, прежде чем сам маршрут будет выполнен?

Ответы

Ответ 1

Я стараюсь настроить объекты application - объект, который инкапсулирует весь код, необходимый для запуска моего приложения. Затем я беру параметры в этот конструктор объектов, чтобы их можно было использовать объектом app. Передача предварительно загруженных данных JSON в объект приложения - это одна из вещей, которые я делаю, чтобы код был нормальным и инкапсулирован.

Это происходит примерно так:

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, _);

И затем на моей странице, где нужно запустить приложение, я делаю это:

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

Это, конечно, версия рельсов. Просто замените <%= ... %> на вашу версию синтаксиса Razor в ASP.NET MVC.

Ответ 2

if on Rails: в дополнение к ответу Dericks вы можете использовать Gon, чтобы "получить переменные Rails в js".

то вы должны инициализировать свое приложение следующим образом:

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

Ответ 3

Отличный пример от Дерика! Для MVC 3+ используйте этот синтаксис:

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