2013-05-08 22 views
8

Tôi đang làm việc trên SPA mà tôi muốn sử dụng nhiều chế độ xem chính. Đây là trường hợp sử dụng của tôi:Durandal Nhiều trang chính

Tôi có một người dùng có trang tiểu sử. Trong trang hồ sơ đó tôi muốn có thể hiển thị một vài quan điểm khác nhau, tức là. chi tiết, công trình, thông tin liên hệ, v.v. Tôi cần có khả năng liên kết sâu đến từng chế độ xem này. Mỗi chế độ xem này phải hiển thị dữ liệu người dùng cơ bản từ chế độ xem bố cục chính. Đó là sự hiểu biết của tôi rằng tôi nên sử dụng soạn thảo cho điều này và tôi có một chút mã mà dường như hoạt động, tuy nhiên, tôi muốn có thể chuyển dữ liệu từ "trình bao thứ cấp" xuống chế độ xem phụ thực tế. . Dường như dữ liệu splat không được truyền theo phương thức kích hoạt của viewmodel phụ.

Trong chế độ xem "chính" của tôi, tôi đã tạo một chế độ xem có thể quan sát được gọi là activeView có chứa một chuỗi tương ứng với chế độ xem phụ (viewmodels/user/details). Sau đó tôi có tuyên bố loại trực tiếp như sau:

<!-- ko compose: { 
    model: activeView(),   
    activate: true 
} --><!-- /ko --> 

Làm cách nào để chuyển dữ liệu đến chế độ xem phụ? Hoặc là có một cách tốt hơn để làm điều này?

Cảm ơn trước!

Trả lời

1

Theo tôi, ko.compose không quá năng động và dường như hoạt động như bố cục của Razor. Với durandal, tốt hơn hết là bạn nên tạo các chế độ xem riêng biệt như bạn có thể và sau đó, liên kết chúng với bộ định tuyến. Tôi đang làm việc với mẫu Hot-Towel của John Papa; Các đề xuất của tôi liên quan đến việc truyền dữ liệu (nhiều hơn id) với bộ định tuyến và loại bỏ sầu riêng.

Khi khởi tạo ứng dụng của bạn (shell.js, main.js, ...) bản đồ tuyến đường của bạn ở đâu đó (shell.js hoặc main.js) với các thiết lập cho cuối cùng lọc. Đối với các tuyến đường đó sẽ vận chuyển dữ liệu, xây dựng chúng với (: id) đề nghị

router.mapRoute('view/:id', moduleId, 'Customer Details', false); 

ở đâu và khi một số tuyến cần thiết Bạn có thể có một cái nhìn đến giải pháp Joseph Gabriel (https://stackoverflow.com/a/16036439/2198331) để lọc các tuyến đường của bạn cho sử dụng ở đâu và khi nào bạn cần chúng. Sau khi lọc các tuyến đường, bạn có thể hack routeInfo để truyền thông số của bạn (chuỗi hoặc đối tượng như selectedItem).

arearoutes = ko.utils.arrayFilter(router.visibleRoutes(), function (route) { 
       // mgpe has been set at app init 
       return route.settings.mgpe === 112; 
      }); 

mở rộng routeInfo của bạn từ kết quả lọc với dữ liệu bạn muốn để vận chuyển

areaRoutes.forEach(function(ar){ 
    ar.myItem = mydata; // or vm.selectedItem(); DEPARTURE LUGGAGE 
}, areaRoutes); 

của bạn (myItem) bây giờ được gắn vào các đường bay như vậy theo ý muốn Tuyến đường này hoặc những (s) sẽ mang theo dữ liệu của bạn với chúng và sẽ không bao giờ mất dữ liệu trừ khi bạn cập nhật cùng một đối tượng của bộ định tuyến (myItem)

function activate(adata){ 
     vm.arrivalData(adata.routeInfo.myItem); // ARRIVAL LUGGAGE are here 
} 

tuyến đường có thể mang tuyến đường lồng nhau Hữu ích cho ngữ cảnh lồng nhau như menu lồng nhau; bạn có thể chơi với các tuyến đường dành cho trẻ em bằng cách chuẩn bị chuyến đi khi tuyến đường chính hoạt động:

router.activeItem.settings.areSameItem = function (currentItem, newItem, activationData) { 
    mybag = activationData.routeInfo; // TRAVEL (current) LUGGAGE are present here 
} 

N.B. : trước khi sử dụng công việc này, bạn phải xem xét vấn đề bảo mật và vì tôi mới dùng durandal Tôi không biết liệu điều này có mang lại hậu quả nghiêm trọng trong vòng đời của tuyến đường không. Ngoài ra, hãy lưu ý với tên của đối tượng khi nó ở lại vĩnh viễn trong suốt quá trình định tuyến của router.

0

Bạn tạo đối tượng người dùng và yêu cầu nó trong mỗi mô hình xem của bạn như thế nào? Điều dễ dàng là đính kèm nó vào ứng dụng (ví dụ: app.user =) Các thay đổi được thực hiện cho bất kỳ quan sát nào trong đối tượng người dùng được nói sẽ cập nhật cho mỗi chế độ xem và chế độ xem trong SPA của bạn.

Bằng cách đó bạn đang tận dụng khả năng của thư viện/thư viện loại trực tiếp

+0

Ứng dụng mà tôi đã viết yêu cầu hành vi này trên nhiều đối tượng người dùng. Durandal 2.0 đã giới thiệu "bộ định tuyến con" về cơ bản cho phép người dùng tạo nhiều vỏ lồng nhau với hỗ trợ liên kết sâu. Các bộ định tuyến trẻ em tự nhiên là con đường để đi cho tôi. – mcottingham

+0

Đã hiểu, hai ý tưởng này (định tuyến và dữ liệu ứng dụng) hoạt động cùng nhau. Bạn đang xây dựng một SPA mà khởi tạo chính nó ở phía khách hàng và hiếm khi làm một bài viết đầy đủ trở lại. Giá trị bạn nhận được là có thể tiếp cận simliar phát triển của bạn với ứng dụng dành cho máy tính để bàn thay vì ứng dụng web truyền thống sử dụng toàn bộ bài đăng. Điều này có nghĩa là bạn có thể tạo một datacontext để lưu các đối tượng vào bộ nhớ. Bằng cách đó bạn không phải truyền các đối tượng giữa các khung nhìn, bạn chỉ có thể duy trì một datacontext toàn cục và truyền xung quanh một ID trong route bằng cách sử dụng các tham số chứ không phải toàn bộ các đối tượng. – onzur

Các vấn đề liên quan