Question

我正在努力创建一个基本的调查应用程序，以便更好地理解Backbone中的嵌套模型/集合。我正在使用骨干关系来帮助解决这个问题。

我可以循环浏览调查并在使用一个视图时显示问题/答案。但是，当我尝试将这些转换为单独的问题/答案视图时，我在制作它们时遇到了一些麻烦。

知道为什么questionView没有填充#questions html？一如往常，任何帮助都非常感谢！

调查显示视图：

class SurveyMe.Views.SurveyShow extends Backbone.View

  template: JST['templates/surveys/survey_show']

  initialize: ->
    @model.on('all', @render, this)
    @questionNumber = 0
    @questionLimit = @model.get("questions").length - 1

  render: ->
    $(@el).html(@template(survey: @model, questionNumber: @questionNumber))
    @renderQuestion()
    this

  back: ->
    if @questionNumber <= @questionLimit and @questionNumber > 0
      @questionNumber -= 1
      $("#container").html(@render().el)
    else
      Backbone.history.navigate("surveys",trigger: true)

  events:
      'click #answer': 'updateQuestion'
      'click #back': 'back'

  updateQuestion: ->
    if @questionNumber < @questionLimit
      @questionNumber += 1
      $("#container").html(@render().el)
      choice = new SurveyMe.Models.Choice
      choice.save(
        choice:
          appuser_id: Cookie.get('survey_user_id')
          question_id: @model.get('questions')[@questionNumber]["id"]
          answer_id: "4"
      )
      @renderQuestion()
    else
      completion = new SurveyMe.Models.Completion
      completion.save(
        completion:
          survey_id: @model.get('id')
          appuser_id: Cookie.get('survey_user_id')
      )
      Backbone.history.navigate("surveys",trigger: true)

  renderQuestion: ->
    question = new SurveyMe.Models.Question(id: @model.get("questions")[@questionNumber]["id"])
    questionView = new SurveyMe.Views.Question(model: question)
    $('#questions').html(questionView.render().el)

问题观点：

class SurveyMe.Views.Question extends Backbone.View

  template: JST['templates/surveys/question']

  tagName: 'li'

  className: 'list-group-item text-center'

  events: 
    'click': 'edit'

  edit: ->
    Backbone.history.navigate("questions/#{@model.get('id')}",true)

  initialize: ->
    #alert("initialize " + @model.get('id'))
    @render()

  render: ->
    $(@el).html(@template(question: @model))
    this

survey_show.jst.eco（评论文本用于显示问题/答案，无需单独的问题/答案视图）

<h2 class="text-center"><%= @survey.get('title') %></h2>

<div class="row">
    <div class="3">
        <ul id="questions" class="list-group">

        <!--
            <li id="question" class="list-group-item text-center">
                <%= @survey.get("questions")[@questionNumber]["title"] %>
                <ul id="answers" class="list-group">
                    <% for answer, j in @survey.get("questions")[@questionNumber]["answers"]: %>
                    <li id="answer" class="list-group-item">
                        <%= @survey.get("questions")[@questionNumber]["answers"][j]["title"] %>
                    </li>
                    <% end %>
                </ul>
            </li>
        -->

        </ul>
    </div>
</div>

<button class="btn" id="back">Back</button>

question.jst.eco

<%= @question.get('title') %>
<ul class="list-group">
    <% for answer, i in @question.get("answers")[i]: %>
        <li id="answer" class="list-group-item">
            <%= @question.get("answers")[i]["title"] %>
        </li>
    <% end %>
</ul>

调查模型：

class SurveyMe.Models.Survey extends Backbone.RelationalModel

  defaults: 
    title: 'Enter survey name'
    survey_limit: 1000
    number_taken: 0
    long: false
    survey_finished: false

   urlRoot: '/surveys'

   relations = [{
     type: Backbone.HasMany,
     key: 'questions',
     relatedModel: 'SurveyMe.Models.Question'
     reverseRelation: {
        key: 'survey',
        includeInJSON: 'id'
     }
   }]

问题模型：

class SurveyMe.Models.Question extends Backbone.RelationalModel

   urlRoot: '/surveys'

   relations = [{
     type: Backbone.HasMany,
     key: 'answers',
     relatedModel: 'SurveyMe.Models.Answer'
     reverseRelation: {
        key: 'question',
        includeInJSON: 'id'
     }
   }]

答案型号：

class SurveyMe.Models.Answer extends Backbone.RelationalModel

    urlRoot: '/answers'

在Backbone中嵌套视图不显示渲染的HTML

0 个答案: