2012-07-08 10 views
6

Một cái gì đó tôi đã nhận thấy gần đây với Ember Router là nó chỉ cho phép điều hướng đến các tuyến đường lá - tuyến đường mà không có con đường.Tại sao Ember Router chỉ cho phép điều hướng đến các tuyến đường lá?

Bây giờ, trừ khi tôi đang làm những việc không chính xác thì điều này có vẻ như lỗi/lỗi trong thiết kế.

Hãy lấy ví dụ như một cái gì đó như thế này:

Tôi có một bộ sưu tập của các dự án, mỗi dự án có nhiều cộng tác viên, với điều này tôi muốn xây dựng một giao diện người dùng với một bố cục 3 cột (giống như ứng dụng email máy tính để bàn tiêu chuẩn của bạn) ở bên trái, tôi có danh sách các dự án, khi nhấp vào một dự án, cột giữa hiển thị danh sách cộng tác viên và nhấp vào cộng tác viên sẽ tải chi tiết của nó vào cột bên phải.

Bây giờ với định tuyến tôi muốn điều hướng đến /projects/1 khi nhấp vào một dự án và vào /projects/1/collaborators/23 khi nhấp vào cộng tác viên.

Dưới đây là một router minh họa phần đầu tiên của tuyến đường lồng nhau:

App.reopen(
    Router: Ember.Router.extend(
    enableLogging: true 
    location: 'hash' 

    root: Ember.Route.extend(
     index: Ember.Route.extend(
     route: '/' 

     redirectsTo: 'projects' 
    ) 

     projects: Ember.Route.extend(
     # This route is not routable because it is not a leaf route. 
     route: '/projects' 

     connectOutlets: (router) -> 
      # List projects in left column 
      router.get('applicationController').connectOutlet('projects', App.projects) 

     show: Ember.Route.extend(
      # This route is routable because it is a leaf route. 
      route: '/:project_id' 

      connectOutlets: (router, project) -> 
      # Render the project into the second column, which actually renders 
      # a list of collaborators. 
      router.get('projectsController').connectOutlet('project', project) 
     ) 
    ) 
    ) 
) 
) 

Như bạn sẽ thấy Ember không gọi updateRoute (thiết lập địa chỉ URL) cho đến khi chuyển sang root.projects.show vì dòng này https://github.com/emberjs/ember.js/blob/master/packages/ember-routing/lib/routable.js#L81

Có ai khác đã làm bất cứ điều gì như thế này không? Có cách nào tốt hơn để thiết kế này?

Trả lời

7

Cách tốt nhất tôi đã tìm thấy để thực hiện việc này là có trạng thái root.projects.index với tuyến đường "/" và không có gì khác. Bằng cách này, mỗi trang đều có trạng thái cụ thể của riêng nó.

projects: Ember.Route.extend(
    # This route is not routable because it is not a leaf route. 
    route: '/projects' 

    connectOutlets: (router) -> 
    # List projects in left column 
    router.get('applicationController').connectOutlet('projects', App.projects) 

    index: Ember.Route.extend(
    route: "/" 
) 

    show: Ember.Route.extend(
    # This route is routable because it is a leaf route. 
    route: '/:project_id' 

    connectOutlets: (router, project) -> 
     # Render the project into the second column, which actually renders 
     # a list of collaborators. 
     router.get('projectsController').connectOutlet('project', project) 
) 
) 

N.B. Điều đó đang được nói rằng tôi đang làm một điều tương tự với bố cục 3 cột và kết hợp cột giữa và cột bên phải với các tuyến như trên và thêm cột bên trái trong bố cục được chia sẻ cho mỗi chế độ xem trung bình có thể có.

+0

Cảm ơn Bradley, điều đó có vẻ như là lừa. – Ivan

+0

Rất thông minh. Cảm ơn vì tiền hỗ trợ. – nembleton

+0

@BradleyPriest Tôi có [câu hỏi] (http://stackoverflow.com/questions/11377498/ember-js-crud-scenarios-specifying-view-from-within-a-route) về việc này. Tôi thấy khó hiểu cách sử dụng Ember.Router với các kịch bản CRUD. Bạn có thể xem không? – MilkyWayJoe

2

Tôi nghĩ vấn đề này đã được giải quyết. Tôi đang sử dụng các tuyến đường ember không có chỉ mục và không gặp phải bất kỳ vấn đề nào về trạng thái lá. Tôi đã duyệt lý do tại sao chúng tôi cần một chỉ mục ở tất cả và tôi đã hạ cánh ở đây. Có lý do nào khác để sử dụng trạng thái chỉ mục không?