Question

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

示例（在coffeescript中）：

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

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

对于复制方法签名或将传统控制器行为移入路径，这似乎是糟糕的架构。

还有更好的设计模式仍然可以使用路由器吗？

Answer 1

这篇文章Ember.js Router Action to Controller回答了这个问题。

使用{{action "foo" target="controller"}}电话

Ember.js应用程序架构与路由器，如何避免重复的方法

1 个答案: