アプリには、動的なレイアウトを示す mainRegion があります。ルーティングの問題とレイアウトへのアクセス、およびその更新のコンボの問題がありますpizzaTypeRegion。このレイアウトは list_controller.js.coffee で作成され、pizzaTypeNameRegion(ピザの種類の名前を保持) とpizzaTypeRegion(ピザの種類の詳細を表示) があります。pizzaTypeRegionurl: を手動で編集するときにを更新したいと思いますhttp://localhost:3000/#pizza_types。#pizza_types は、期待どおりにすべての Pizza_types を示しています。
のリンクをクリックすると、問題なく適切なコンテンツで がpizzaTypeNameRegion更新されます。pizzaTypeRegion
URL に Pizza_type の ID を手動で入力する場合:
http://localhost:3000/#pizza_types/1- 最初のピザの種類を表示する必要がありますが、pizzaTypeRegion
http://localhost:3000/#pizza_types/2- 2 番目のピザの種類を表示する必要がありますが、pizzaTypeRegion
特定の Pizza_type がコンソールへのロギングを介して取得されたという証拠を得ています。
Pizza_types_app.js.coffee
@Pizzeria.module "PizzaTypesApp", (PizzaTypesApp, App, Backbone, Marionette,$, _) ->
@startWithParent = false
class PizzaTypesApp.Router extends Marionette.AppRouter
appRoutes:
"pizza_types" : "listPizzaTypes"
"pizza_types/:id" : "showPizzaType"
API =
listPizzaTypes: ->
PizzaTypesApp.List.Controller.listPizzaTypes()
showPizzaType: (model) ->
PizzaTypesApp.Show.Controller.showPizzaTypeFromEvent model
App.on "pizzaTypes:show", ->
App.navigate "pizza_types"
API.listPizzaTypes()
App.addInitializer ->
new PizzaTypesApp.Router
controller: API
App.reqres.setHandler "show:pizza:type:view", (model) ->
API.showPizzaType model
App.reqres.setHandler "show:first:pizzaType:view", ->
API.showFirstPizzaType()
list_controller.js.coffee
@Pizzeria.module "PizzaTypesApp.List", (List, App, Backbone, Marionette, $, _) ->
List.Controller =
listPizzaTypes: ->
pizzaTypes = App.request "get:pizza:types:entities"
pizzaType = gon.pizza_type
@layout = new List.Layout
@layout.on "show", =>
@pizzaTypeNameRegion pizzaTypes
@pizzaTypeRegion()
App.mainRegion.show @layout
pizzaTypeNameRegion: (pizzaTypes) ->
pizzaTypesNameView = new List.PizzaTypeNames
collection: pizzaTypes
@layout.pizzaTypeNameRegion.show pizzaTypesNameView
pizzaTypesNameView.on "itemview:show:pizza:type", (childView, pizzaType) =>
@newPizzaTypeRegion(pizzaType)
pizzaTypeRegion: ->
initialPizzaTypeView = App.request "show:first:pizzaType:view"
@layout.pizzaTypeRegion.show initialPizzaTypeView
newPizzaTypeRegion: (pizzaType) ->
newPizzaTypeView = App.request "show:pizza:type:view", pizzaType.id
@layout.pizzaTypeRegion.show newPizzaTypeView
show_controller.js.coffee
@Pizzeria.module "PizzaTypesApp.Show", (Show, App, Backbone, Marionette, $, _) ->
Show.Controller =
showPizzaTypeFromEvent: (model) ->
pizzaType = App.request "pizzaType:entity", model
pizzaTypeView = new Show.PizzaType
model: pizzaType
App.mainRegion.show pizzaTypeView
# mainRegion is updated with whatever the url is
# ex)`http://localhost:3000/#pizza_types/2` will
# place the pizza_type with the id of 2 in the
# App's mainRegion, breaking the layout that I
# set up in the list_controller.js.coffee. Browser back and forward
# buttons work, but layout is broken, missing other regions (and their info)
pizzaTypeRegion新しいピザの種類でを更新するにはどうすればよいですか? pizzaTypeRegionURL を手動で入力してレイアウト内の他の領域に影響を与えずに、list_controller で作成されたレイアウト インスタンスにアクセスして新しいコンテンツで更新する方法はありますか?
**編集**
- 上記のコードを取り除き、すべてを元に戻して、懸念事項の分離を維持できるようにしました。グローバルではなく、イベントバスを使用することになりました
:
リストコントローラー:
newPizzaTypeRegion: (pizzaType) ->
id = pizzaType.id
App.vent.on "new:pizza:type:for:pizza:type:region", (pizzaTypeView) =>
@layout.pizzaTypeRegion.show pizzaTypeView
show_controller:
showPizzaTypeFromEvent: (id) ->
pizzaType = App.request "pizzaType:entity", id
pizzaTypeView = new Show.PizzaType
model: pizzaType
App.vent.trigger "new:pizza:type:for:pizza:type:region", pizzaTypeView
List.Controller は自分自身を更新する方法を知っており、Show.Controller は List.Controller に更新するコンテンツを伝えます。うまく機能し、非常にクリーンで、分離されています。