Как использовать несколько объектов маршрутизатора в ember.js

Question

Я все еще новичок в ember.js, но одна часть фреймворка, которую мне еще предстоит увидеть в масштабе, - это базовый Ember Router. В небольшом одностраничном приложении у вас есть только один маршрутизатор, который управляет всеми состояниями / маршрутами и т. Д. Но как растет ваше приложение, как вы справляетесь со сложностью, если шаблон, кажется, фокусируется только на 1 объекте?

Любопытно, если это просто то, что я упустил из виду, или предполагается, что это огромный глобальный объект управления состоянием, например, AppDelegate в iOS.

Answer 1

Я не знаю, является ли мой путь общепринятой передовой практикой, но я знаю, что когда маршрутизатор становится большим, его следует разбить на несколько файлов. Я достиг этого, как это:

app_router.js

App.Router = Ember.Router.extend({
  enableLogging: true,
  root: Ember.Route.extend({
    route: '/',
    index: Ember.Route.extend({
      route: '/',
      redirectsTo: 'app.index'
    }),
    app: Ember.Route.extend({
      route: '/app',
      showProfile: Ember.Route.transitionTo("user.index"),
      index: Ember.Route.extend({
        route: '/',
        redirectsTo: 'items'
      }),
      items: App.ItemsRoute,
      item: App.ItemRoute,
      users: App.UsersRoute,
      user: App.UserRoute,
      hashtagbrand: App.HashtagbrandRoute
    })
  })
});

items_router.js

App.ItemsRoute = Ember.Route.extend({
  route: '/items',
  connectOutlets: function(router, items) {
    router.get("applicationController").connectOutlet({
      name: 'carouselContainer',
      outletName: 'carousel',
      context: App.store.find(App.Item)
    });
    router.get("applicationController").connectOutlet({
      name: 'logo',
      outletName: 'header'
    });
  },
  index: Ember.Route.extend({
    route: '/'
  })
}); 


App.ItemRoute = Ember.Route.extend({
  route: '/items/:id',
  //...
  index: Ember.Route.extend({
    route: '/'
    //...
  })
});