2013-07-21 18 views
5

Tôi có một ứng dụng KO và mỗi trang của tôi có một mô hình xem riêng biệt xử lý tất cả các hành động cần thiết trên trang đó (tải, thêm, chỉnh sửa, xóa, vv). Tôi đã quản lý để chia mã thành nhiều mô-đun bằng cách sử dụng RequireJS, nhưng tôi không thể tìm thấy cách để nhiều mô hình xem hoạt động cùng một lúc bằng Sammy.Knockout, Require, Sammy và mô hình xem cho mỗi trang - làm cách nào để làm cho nó hoạt động?

Đây là thiết lập tôi có trong tệp init.js của mình vào lúc này, tải nội dung trên trang đầu tiên. Và nó hoạt động:

require(['jquery', 'ko', 'sammy', 'viewmodels/page1'], function($, ko, sammy, page1) { 
    var page1VM = new page1.ViewModel(); 
    ko.applyBindings(page1VM); 

    var app = sammy('#wrapper', function() { 
    this.get('#page1', function() { 
     page1VM.loadContent(); 
    }); 

    this.get('#page2', function() { 
     // do nothing yet 
    }); 

    [...] 

    this.get('#pageX', function() { 
     // do nothing yet 
    }); 
    }); 

    app.run('#page1'); 
}); 

Làm cách nào để gắn kết các kiểu xem khác của tôi với các trang khác?

Tôi cũng đã thử thêm ko.applyBindings riêng cho mỗi trang bên trong this.get, điều này đã xảy ra lỗi khi tôi chuyển lại trang đã áp dụng các ràng buộc đó.

+3

Bạn có thể quan tâm đến Durandal, một khuôn khổ cơ bản bao gồm tất cả những thứ này cùng nhau cho bạn. – Tyrsius

Trả lời

2

http://jsfiddle.net/PgLgz/4/

Được rồi tôi đã đi trở lại vào fiddle và làm sạch tất cả các mã lên để cho bạn thấy một cách hiệu quả những gì tôi có nghĩa là bởi câu trả lời của tôi -

function myViewModel() { 
    var self = this; 
    self.message = "hey"; 
    self.page1VM = new page1VM(); 
    self.page2VM = new page2VM(); 
    var app = sammy('#wrapper', function() { 
     this.get('#page1', function() { 
      page1VM .loadContent(); 
     }); 
    }); 
}; 

ko.applyBindings(new myViewModel()); 

nhớ rằng mặc dù trong fiddle tôi có thể không thực sự sử dụng Sammy.js (Tôi không thay đổi quan điểm hoặc điều hướng) và về cơ bản không có lý do để sử dụng Require.js vì nó chỉ là một ví dụ và tôi đặt tất cả các kiểu xem trong cùng một tệp JS.

Vì bạn đang sử dụng Sammy và Yêu cầu bạn sẽ cần phải lấy mã này và áp dụng chức năng cho trang web của bạn hoặc đăng một đoạn mã lớn hơn ở đâu đó.

+0

Nó dường như không hoạt động nếu không có applyBindings. Có lẽ tôi đang làm điều gì sai. Đây là mô hình xem trang1: http://snippi.com/s/jwcf5zb – Norbert

+0

Có bạn vẫn cần áp dụng các ràng buộc Tôi sẽ cập nhật câu trả lời để bao gồm –

+0

Nó ném một lỗi "đối tượng không phải là một hàm" cho dòng applyBindings. – Norbert

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