获取 Ember.js 中的路线列表

Question

在我的主页 (index.hbs) 上，我需要显示符合给定条件（例如具有特定属性）的每条路线的链接列表。所以我需要的是这样的东西：

// Define a route with some attribute
App.FirstRoute = Ember.Route.extend({
    showOnIndex: true
});

// Get a list of visible routes in the IndexController
visibleRoutes: function() {
    var routes = /* How to do this */
    return routes.filter(function(route) {
        route.get('showOnIndex'));
    });
}.property()

问题是如何得到routes。我发现我可以通过以下方式获得路线名称列表：

var router = this.get('target');
var names = router.router.recognizer.names;

但我找不到如何将它们转换为 Route 对象。据推测 Router 有这样做的信息，但 AFAICS 它没有公开曝光。有什么建议么？

Answer 1

这是一种方法，尽管我认为它有点可怕，从长远来看甚至可能很危险，因为它使用的是 Javascript 而不是 Ember API.我们首先通过您的 'App' 对象获取路由。您可以使用 Object.keys(App) 获取它包含的所有 classes 的列表。然后你可以遍历其中的每一个，检查它是否是带有 .superclass 的路由，如果它是路由，它将是 Ember.Route。然后您可以检查每个原型的 showOnIndex 属性。

var allRoutes = [];
Object.keys(App).forEach(function(key, index, allKeys) {
    if (App[key].superclass === Ember.Route && App[key].prototype.showOnIndex === true) {
        allRoutes.push(App[key]);    
    }
});

我们现在有一个包含 showOnIndex 为 true 的所有 class 路由名称的数组。

但是，您仍然有将识别器中的名称与路线的 class 名称对齐的问题，但由于 Ember 方式是像 my/url 这样的路线将映射到 MyUrlIndexRoute 和 'my.url.index' 等，然后您可以按大写拆分路由，删除最后一部分 ('Route')，将它们连接在一起并将其全部转换为小写。

var routesByName = [];
allRoutes.forEach(function(name, index, all) {
    var names = name.match(/[A-Z][a-z]+/g);
    names.pop();
    var routeName = names.join('.').toLowerCase();
    routesByName.push(routeName);
});

然后您可以循环遍历模板中的 routesByName 并为每个创建一个 {{#link-to}}。

我认为实现您想要的效果的更好方法可能是在您的应用程序中分别保留指向其 showOnIndex 值的所有路由的映射，并为您要添加的每个新路由更新它。从长远来看，它可能更安全，因为谁知道 Ember 内部结构将来会如何变化，这可能会阻止执行上述某些操作。

请注意，我在 chrome 中的 Ember 应用程序中以调试器模式检查了所有这些，但没有直接运行所有代码片段，因此对任何错误表示歉意。

Answer 2

如何使用容器和查找？

Ember.keys(App.Router.router.recognizer.names).map(function(name) {
  return App.__container__.lookup('route:' + name);
}).compact();

我知道您访问 __container__ 是私有的。但通常你不应该访问所有的路由。

获取 Ember.js 中的路线列表

Getting a list of routes in Ember.js

javascript

ember.js