Szkielet dynamicznie przełącza szablony

Question

Muszę wstępnie ustawić szablon widoku szkieletowego na podstawie tego, czy data wybrana przez użytkownika jest w przeszłości czy w przyszłości, a także zmienić ją później, gdy zmienia się kolekcja, pobierając dane z innej daty. Jak mam to zrobic? Pomyślałem, że będę w stanie ustawić szablon na funkcję, która zwraca poprawny ciąg selektora na podstawie tego, czy jestem w przeszłości, czy nie, ale to nie działa.

pR.views.ScheduleJobView = Backbone.Marionette.ItemView.extend({ 
    tagName: "tr", 
    // NEED A WAY TO SWITCH THIS TOO 
    template: "#schedule-job-template" 
}); 


pR.views.ScheduleJobsView = Backbone.Marionette.CompositeView.extend({ 
    // DOESN'T WORK 
    template: function() { 
     if (this.isPast) 
      return "#schedule-jobs-past-template"; 
     else 
      return "#schedule-jobs-template"; 
    },  itemView: pR.views.ScheduleJobView, 

    itemView: pR.views.ScheduleJobView, 
    itemViewContainer: "tbody", 

    // Defaults for the model's url 
    baseUrl: "/schedules/day/", 
    baseApiUrl: "/api/schedule/day/", 
    // Empty object to store url parameters 
    urlParameters: {}, 

    initialize: function() { 
     pR.vent.bindTo("change:parameters", this.changeUrl, this); 
     this.model.url = this.baseApiUrl; 
    }, 

    onRender: function() { 
     console.log("Rendering Jobs View"); 
    }, 

    // Change the main model's url 
    changeUrl: function (parameters) { 
     // merge new parameters with old ones 
     this.urlParameters = _.extend(this.urlParameters, parameters); 

     var url = ""; 
     var apiUrl = this.baseApiUrl; 

     _.each(this.urlParameters, function (value, parameter) { 
      // Add each parameter segment to the url 
      url = url + parameter + '/' + value + '/'; 
      apiUrl = apiUrl + parameter + '/' + value + '/'; 
     }); 

     this.model.url = apiUrl; 
     console.log("Updated CurrentDay model url to " + apiUrl); 
     this.model.fetch(); 

     console.log("Navigating to " + url); 
     pR.routers.appRouter.navigate(url); 
    }, 

    // Check if we are in the past 
    isPast: function() { 
     var year = this.urlParameters.year; 
     var month = this.urlParameters.month; 
     var day = this.urlParameters.day; 
     var selectedDate = Date(year, month, day); 

     if (selectedDate < Date()){ 
      return true; 
     } else { 
      return false; 
     } 
    } 
}); 

Zauważ, że używam kompozytowe widoki Marionette tu też, więc muszę sposób zmienić szablon w itemView w oparciu o ramy czasowe, jak również. Zdecydowanie jestem otwarty na to inaczej, jeśli moja podstawowa strategia jest źle przemyślana.

Answer 1

Ustawiasz to.template na metodę, a Marionetka szuka wartości ciągu.

Prawdopodobnie można uciec przy użyciu tej samej logiki, ale wprowadzając ją do swojej metody initialize.

pR.views.ScheduleJobsView = Backbone.Marionette.CompositeView.extend({ 
    template: null, 
    [ ... ] 
    initialize: function() { 
     if (this.isPast) { 
      this.template = "#schedule-jobs-past-template"; 
     } else { 
      this.template = "#schedule-jobs-template"; 
     } 

Answer 2

Istnieje funkcja nazywa getTemplate wbudowany do tego, wiem, widziałem go w dokumentacji (to co miałem do googlowania)

Marionette template switching documentation