Ember.js - 頁面上的多個組件

Question

我試圖構建一個Ember應用程序，我遇到了一些困難。

我有一個指數的路線，我要呈現如下頁面：

+--------------------------+ 
| Welcome, foo@bar.com | 
+--------------------------+ 
|       | 
|  New Posts   | 
|  ---------   | 
|   *foo   | 
|   *bar   | 
|   *baz   | 
|       | 
+--------------------------+ 

所以我有一個Account模型和Post模型。 （其中沒有任何相關領域）

我在與以下概念上的困難：

灰燼航線有model方法返回路由的模型。但是如果我想讓多個模型與我的路線相關聯呢？在這種情況下，我有Account和Post。我如何讓他們都可以在我的頁面上使用？

有一件事我已經試過是使用setupController和控制器上手動設置account和posts這樣他們就可以通過模板進行訪問。但是如果我能做到這一點，那麼model方法的意義何在？

爲什麼Ember想要將路線與只有一個模型相關聯？我試過

欣賞任何建議，

感謝， 丹尼爾

Answer 1

一件事是使用setupController和手動設置帳戶和崗位的控制器上，因此它們可以被模板訪問。

你在做什麼是正確的，這就是setupController鉤子的用途。

但是，如果我能做到這一點，模型方法的重點/意義是什麼！爲什麼Ember想要將路線與單一模型相關聯？

在RC3，防止默認行爲是不可能的。在RC4中，執行setupController掛鉤可防止發生默認行爲。這是開發人員遷移到新版本的潛在重大改變。

還要注意的是，如果你的路線實現setupController鉤和你想保留默認的行爲（model從也被調用），請確保您從setupController鉤內調用this._super()。您可以在宣佈的博文中閱讀更多here。

希望它有幫助。

Answer 2

使用model回調有一定的優勢：

1. 它自動生成模型回調當你定義路由器。
2. 在模板中，當您使用link-to "someRoute" model時，當您單擊該鏈接並轉換到另一個路線時，路線將使用您傳入的模型作爲模型（不需要調用model回調來獲取數據）。

見http://emberjs.com/api/classes/Ember.Route.html#method_model

而且最大的優勢，我認爲，是承諾的支持。

路由使用model回調來獲取它需要的數據，然後在setupController中，它將數據傳遞給第二個參數。

請注意我的意思是setupController從model獲取數據回調。如果model回調函數返回一個promise，則該路由將等待，直到解決該promise，然後從promise中獲取數據。如果承諾正在處理，則不會調用setupController，並且不會呈現模板。

App.PostsRoute = Em.Route.extend({ 
    model: function() { 
    // The server response an array of posts like [{name: 'foo'}, {name: 'bar'}, {name: 'baz'}] 
    return $.get('/api/posts.json'); 
    }, 

    setupController: function(controller, model) { 
    console.log(model); // it's array, not promise object 
    controller.set('model', model); 
    } 
}); 

當你可以使用setupController做同樣的事情，是這樣的：

App.PostsRoute = Em.Route.extend({ 
    setupController: function(controller, model) { 
    $.get('/api/posts.json').then(function(data) { 
     controller.set('model', data); 
    }); 
    } 
}); 

，但setupController不支持承諾，這意味着如果你在setupController從服務器獲取數據，數據準備之前，Ember將呈現模板。在很多情況下，這不是我們想要的。

但是，model似乎不是從服務器獲取多個數據的好地方。您可以使用Ember.RSVP.all來實現多個承諾。但你也需要考慮link-to。我不知道什麼是最佳做法 以獲取路線中的多個數據，並在呈現模板之前等待它們全部準備好。如果有人有一個很好的解決方案，請告訴我！

對於你的情況，我認爲你可以使用不同的路線來做到這一點。畢竟，我認爲像「歡迎，foo@example.com」是所有頁面的頂部欄，對吧？然後你可以把它放在ApplicationRoute中，並在application.hbs模板中渲染帳號信息。