避免Ember.Router中的代碼重複？

我的Ember.Router不斷增長，看起來它很快就會保持超過三十個URL路線。現在，很多這些路線都做同樣的事情，例如連接一個頭部插座（可能佔所有情況的80％）。避免Ember.Router中的代碼重複？

有沒有Ember.js方式來避免這些冗餘？或者我應該將重複的部分移動到一個函數中並調用它？

更新

正如你所看到的，有三種不同的路線（文章，帖子和用戶）。其中兩個連接標題插座，而第三個沒有。現在想象一下，將有25條連接標頭插座的路線和5條不連接的路線。我怎樣才能避免這些重複？

App.Router = Em.Router.extend({ 
    root: Em.Route.extend({ 
    articles: Em.Route.extend({ 
     route: "/articles", 
     connectOutlets: function(router) { 
     router.get("applicationController").connectOutlet("header", "header"); 
     router.get("applicationController").connectOutlet(articles, App.Article.find()); 
     } 
    }), 
    posts: Em.Route.extend({ 
     route: "/posts", 
     connectOutlets: function(router) { 
     router.get("applicationController").connectOutlet("header", "header"); 
     router.get("applicationController").connectOutlet("posts", App.Post.find()); 
     } 
    }), 
    users: Em.Route.extend({ 
     route: "/users", 
     connectOutlets: function(router) { 
     // Don't connect the header here! 
     router.get("applicationController").connectOutlet("users", App.User.find()); 
     } 
    }) 
    }) 
});

來源

2012-11-16 kraftwer1

您可以添加的jsfiddle或一些代碼，你的問題？ – zentralmaschine

你走了... – kraftwer1

只是一個想法。我還沒有實際測試過，但我相信的東西類似這是可行的

// some custom route 
var CommonRouteOrSomething = Em.Route.extend({ 
    route: "/", 
    connectOutlets: function(router) { 
     router.get("applicationController").connectOutlet("header", "header"); 
    } 
}) 

App.Router = Em.Router.extend({ 
    root: Em.Route.extend({ 
     articles: CommonRouteOrSomething.extend({ 
      route: '/articles', // override route string 
      connectOutlets: function(router) { 
       // your other outlet will be connected on the super class 
       this._super(router); 
       // then your actual outlet 
       router.get("applicationController") 
         .connectOutlet(articles, App.Article.find()); 
      } 
     }) 
     ... 
    }) 
})

不知道這是否會實際工作;就像我說的這只是一個基於假設的想法

來源

2012-11-16 14:33:10 MilkyWayJoe

這看起來很有趣，謝謝。我會看看它，同時看看其他人是否也有辦法... – kraftwer1

我相信你會找到更好的方法，這只是一個隨機的想法:)無論如何，讓我們知道什麼你會解決的，因爲這是我必須要做的，直到現在我還沒有想過：P – MilkyWayJoe

好吧，我會這樣做的！ – kraftwer1

也許另一種方法可能是使用嵌套路線。在這裏據我所知，物品連接header插座，而帖子連接帖子outlet。爲了去posts路線，我假設你首先必須去物品路線。（IE /條/個）也就是說beeing說，路由器將是這樣的：

App.Router = Em.Router.extend({ 
    root: Em.Route.extend({ 
    articles: Em.Route.extend({ 
     route: "/articles", 
     connectOutlets: function(router) { 
     router.get("applicationController").connectOutlet("header", "header"); 
     router.get("applicationController").connectOutlet(articles, App.Article.find()); 
     }, 

     posts: Em.Route.extend({ 
     route: "/posts", 
     connectOutlets: function(router) { 
      router.get("applicationController").connectOutlet("posts", App.Post.find()); 
     } 
     }), 
    }), 

    users: Em.Route.extend({ 
     route: "/users", 
     connectOutlets: function(router) { 
    // Don't connect the header here! 
     router.get("applicationController").connectOutlet("users", App.User.find()); 
     } 
    }) 
    }) 
});

來源

2012-11-16 18:34:45

如果OP實際上是通過文章，然後發佈文章，這將是一個更好的方法。我已經這樣做了幾次，但我不知道，我傾向於將事情擴展到我自己的微庫中並從那裏開始工作。但如果這是真的（/ articles/posts），那麼這可能是最好的方法 – MilkyWayJoe

是的你是對的，他可以選擇更適合他的東西。這實際上是一個應用程序是如何根據狀態進行設計的問題。基本上我會說如果帖子與一篇文章相關，那麼嵌套的路線是好的，否則你的解決方案可能會更好。 –

我甚至不確定這個'解決方案'是否可行，這只是一個想法..我認爲我有時會使用繼承方式：P – MilkyWayJoe

避免Ember.Router中的代碼重複？

回答

相關問題