1

过去两周我一直在努力学习 Ember.js,但我真的很挣扎。我希望有一个“哈哈”的时刻,但我尝试实现的每一个新功能总是会导致数小时的测试失败。我只是似乎没有掌握框架。我觉得我正在反对它。我希望有人可以通过这个简单的例子来解释前进的道路。

我正在创建一个网络应用程序,允许用户选择他们将出售给客户的产品。有一个他们可以选择的产品列表,然后是他们选择的产品列表。

我想象一个带有导航控件的左栏和一个主栏,显示他们可以添加到订单中的所选产品或新产品。这是基本模板:

<script type="text/x-handlebars" data-template-name="pc">
    <div id="nav">{{outlet nav}}</div>
    <div id="main">{{outlet main}}</div>
</script>

这是左侧导航模板:

<script type="text/x-handlebars" data-template-name="nav">
    <div class="button">{{#linkTo "pc.add"}}Add Products{{/linkTo}}</div>
</script>

这是选定的产品模板:

<script type="text/x-handlebars" data-template-name="selectedProducts">
    {{#each p in controller}}
        <div class="product">
            <h4>{{p.name}}</h4>
        </div>
    {{/each}}
</script>

这是可用的产品模板:

<script type="text/x-handlebars" data-template-name="addProducts">
    <div id="addProducts" class="addProducts">
        {{#each p in controller}}
            <div class="product">
                <h4>{{p.name}}</h4>
            </div>
        {{/each}}   
        <button {{action "addSelectedProducts"}}>Add Selected Products</button>
        <button {{action "back"}}>Back</button>
    </div>
</script>

我可以使用一些已选择的产品加载“pc”模板。伟大的。我还可以导航到“添加产品”模板。伟大的。但是当我单击“添加选定产品”时,我无法弄清楚如何将选定产品移动到“选定产品”模板后面的控制器/模型中,然后让该模板重新呈现以代替“添加产品”模板'。这真的是两个问题。如何从不同的控制器中更新另一个控制器的模型?而且,我如何从一个事件过渡到另一条路线?

有人可以告诉我您将如何设计路线和控制器吗?我知道这要求很多。我最感兴趣的是看看你如何响应 AppProductsController 中的事件,更新 SelectedProductsController 的模型,然后转换到 SelectedProductsRou​​te 并让它重新渲染模板。

我想相信这是一个了不起的框架,但我一直在碰壁。

安德鲁

4

1 回答 1

1

如何从不同的控制器中更新另一个控制器的模型?

使用需求属性连接控制器。所以像:

//in AddProductsController
needs: ['selectedProducts']
addSelectedProducts: function() {
  // Now selectedProductsController can be accessed via the controllers property
  otherController = this.get('controllers.selectedProducts');
  // add the selected ones...
}

请参阅http://emberjs.com/guides/controllers/dependencies-between-controllers/

然后我如何从一个事件过渡到另一条路线?

//in AddProductsController
this.transitionToRoute('blogPosts');

请参阅http://emberjs.com/api/classes/Ember.Controller.html#method_transitionToRoute

于 2013-05-24T22:21:10.220 回答