2013-07-10 51 views
2

我有一個搜索頁面,我們正在獲取不同類型的搜索結果。在搜索結果列表中我想用從Emberjs的不同模型轉換到另一個模型

{{#linkTo 'someResources.someResource' result}}{{result.Name}}{{/linkTo}} 

和路由someResources.someResource上我想用一個完全不同的模型比在搜索頁上。我怎麼做?當我點擊linkTo的鏈接時,它不會再次加載模型,而是嘗試在此處使用名爲result的模型。

所以我想要做的是當我根據result中的值導航到someResources.someResource時重新加載模型。

我確實有一個名爲App.SomeResource的模型,並找到了適用於該模型的方法,如果我直接進入該頁面。

回答

2

由於問題是我想在使用linkTo進行轉換時完全重新加載模型,因爲這是使用給定的模型,所以無法工作。該問題的解決方案其實很簡單,只需使用常規html a -tag代替。我落得這樣做是這樣的:

<a {{bindAttr href="somePropertyInYourModel"}}>{{someTextProperty}}</a> 

酒店somePropertyInYourModel是包含URL到新頁面的一個屬性。如果url位於ember路由中,它就好像您在地址欄中輸入該地址並按Enter鍵,但沒有完全重新加載頁面。

我認爲這是有可能在燼得到改善,這將是更漂亮,如果我能寫的東西,如:

{{#linkToRoute "resourceA.routeB" params="val1,val2,val3"}}Go here{{/linkToRoute}} 

給我這個路線設置:

App.Router.map(function() { 
    this.resource("resourceA", {{path: "/resourceA"}}, function() { 
     this.route("routeB", {{path: "/:prop1/:prop2/:prop3"); 
    } 
}); 

我想獲得:

<a href="#/resourceA/val1/val2/val3">Go here</a> 

val1,val2,val3的順序很重要,如果訂單被改變,他們也應該在最終的網址中進行更改。

+0

有趣的解決方案,應該在某個時候派上用場。雖然可能會認爲重新加載整個頁面以在單個頁面應用程序中重新加載單個模型是矯枉過正的。 :) –

+0

但你沒有重新加載整個頁面,這是重點:)。如果鏈接位於頁面的ember上下文中,並且目標位於ember應用程序中,則只會重新加載模型,而不是傳遞給路由。所以頁面不會重新加載模型。它就像'transitionTo'或'linkTo',但你讓目標解決模型。 –

+0

我現在明白了。該URL位置是哈希風格,我錯過了,絕對方便。沒有哈希爆炸,它是一個普通的鏈接。 –

2

當您發現使用linkTo時,Ember將繞過model()掛鉤。假設是你已經向它傳遞了一個模型,所以它將使用那個(result)作爲model

您可以使用的下一個鉤子是setupController。既然你有一個model掛鉤在直接路由上工作,你可以直接從這裏調用它。

一個需要注意的是,您還需要允許模型已經加載的直接路線加載。

setupController: function(controller, model) { 
    if (!model.isModel) { 
    this.model().then(function(result)) { 
     controller.set('model', result) 
    } 
    } 
} 

model.isModel是,通過設置直接加載模型中,當與linkTo通過這應該是不存在的屬性isModel此檢查。

注意:上面的代碼假定您在model()鉤子中返回Promise

+0

我意識到有一個更容易解決問題的方法,不要使用'linkTo' :)。相反,我可以使用常規的''''標記並將'href'綁定到模型的屬性,這更容易和更清晰。 –

+0

可能適用於非嵌套資源。 'linkTo'還提供'LinkView',它爲活動路由設置css類。 –

+0

它適用於嵌套資源。用一個通用的a-tag做這件事使模型得到加載,就像刷新頁面一樣,這正是我想要的。 –

相關問題