2

最近我一直在研究 Ember.js 的一些即将到来的项目。使用 Ember.Router 时有关正确架构的文档似乎相当稀少。关于路由器,我注意到的一件事是,似乎所有视图都绑定到路由器上下文而不是它们的控制器甚至视图上下文。因此action,视图中的项目需要路由器中的方法,并且不适用于VieworController对象中的方法。

示例(在咖啡脚本中):

window.App = Ember.Application.create {

    ApplicationController = Ember.Controller.extend()
    ApplicationView = Ember.View.extend
        templateName: 'application'

    FlavorMenuController = Ember.ArrayController.extend
        ##Assume an extension of Ember.Object for a model called DrinkFlavors
        content: []
        promoted_drink_flavor: null

        init: () ->
            @_super()
            ##Assume a method actually chooses a random a drink flavor to promote
            @choosePromotedDrinkFlavor()

        optForNewPromotion: () ->
            dont_include = [ @promoted_drink_flavor ]
            @choosePromotedDrinkFlavor( dont_include )

    FlavorMenuView = Ember.View.extend
        templateName: 'flavor_menu_view'

    Router: Ember.Router.extend
        root: Ember.Route.extend
            flavorMenu: Ember.Route.extend
                route: '/'
                connectOutlets: (router, event) ->
                    router.get('applicationController').connectOutlet('flavorMenu')
}

现在如果我有一个像

<script type="text/x-handlebars" data-template-name="flavor_menu_view">
    <!-- ASSUME SOME VIEW STUFF HERE MAKING UP A MENU OF FLAVORS YOU CAN ORDER -->
    <a {{action optForNewPromotion}}> Ask for another promoted Item </a>
</script>

该操作optForNewPromotion将不起作用,并且会抱怨没有针对此的路线。如果你想让它工作,你必须添加到路由器。

所以在路由器路径的某个地方你需要添加

optForNewPromotion: (router, event) ->
    router.get('flavorMenuController').optForNewPromotion

或者您可以将整个方法的功能移动到路由器中。

对于复制方法签名或将传统控制器行为移动到路由中,这似乎是糟糕的架构。

有没有更好的设计模式仍然使用路由器?

4

1 回答 1

2

This post Ember.js Router Action to Controller answers the question.

Use the {{action "foo" target="controller"}} call

于 2012-07-22T17:27:57.963 回答