2

我想#content先动态显示模态对话框,然后再显示模板,而不是动态渲染模板。负责自动显示包含所选模板的模式的代码应该在哪里?毕竟,取消后如何关闭和删除模态类?这是当前代码:git。我正在学习骨干,不知道正确的模式是什么。

会话路由器:

($, Backbone, App, Session, Layout, AlertQueue) ->
  class App.Routers.SessionsRouter extends Backbone.Router
    initialize: (options) ->
      @user  = options.user
      @token = options.token
      @session = new Session(@user)
      @user.on('change', =>
        @session = new Session(@user)
        @token.fetch()
      )

    routes:
      "signup":               "newRegistration"
      "signin":               "newSession"

    newRegistration: ->
      View = require 'views/registrations/new_view'
      Model = require 'models/registration'
      @view = new View(model: new Model(), user: @user)
      # Layout.setContent(@view)
      # Dialog.show(@view)??

    newSession: ->
      View = require 'views/sessions/new_view'
      @view = new View(model: @session, user: @user, token: @token)
      # Layout.setContent(@view)

布局助手,现在在静态容器中显示内容:

($, Backbone, App) ->
  class Layout extends Backbone.Model
    setContent: (content) ->
      do @currentContent.close if @currentContent?
      @currentContent = content
      ($ '#content').html content.render().el

  App.Helpers.Layout = new Layout

当前模态模板:

#dialog.modal.hide.fade
  .modal-header
    %a.close{href: "#"} ×
    / %h3=title
  .modal-body
    #dialog_content
  .modal-footer
    %a.btn.danger.yes Yes
    %a.btn.secondary.no No

当前模式对话框视图:

($, Backbone, App) ->

  class App.Views.Common.DialogView extends Backbone.View
    template: JST["common/dialog"]

    initialize: (options) ->
        super(options)

    render: ->
      $(@el).html(@template())
      $('.modal', @el).modal()
      return @

    show: ->
      $('.modal', @el).modal('show')

    hide: ->
      $('.modal', @el).modal('hide')

当前对话框初始化程序:

($, Backbone, App, FormView, DialogModalView) ->

  class App.Views.Common.DialogView extends FormView

    className: -> "modal"

    initialize: ->
      view = new DialogModalView()

      $(view.render().el).find(".modal-body").append(@template())
      $(view.render().el.children).modal('show')

会话视图扩展了对话框视图:

($, Backbone, App, Session, DialogView) ->

  class App.Views.Sessions.NewView extends DialogView
    template: JST["sessions/new"]
4

1 回答 1

1

更好的方法是将模态相关的逻辑放置到呈现模板的视图中。当调用视图的渲染方法时,它会渲染模板,然后将具体的视图逻辑与常见的模态功能分离,它应该触发一个事件,例如渲染。

视图本身可以监听这个事件,并在它触发渲染模板上的调用模式时。您可以将回调命名为例如 onRender。如果模态与某些应用程序逻辑相关,则模态创建也可以使用这种事件驱动的方法在视图之外处理。

这个事件驱动的模板和回调逻辑是在Backbone Marionette中实现的(当然模态的处理不在插件中,但它呈现模板并触发事件)。看看它,除此之外,它还有许多功能可以通过自动执行这些重复性任务来节省您的时间。

于 2013-09-08T08:54:27.143 回答