Chế độ xem truy cậpMô hình trong chức năng javascript bên ngoài chế độ xemModel của

Question

Tôi tự hỏi liệu tôi có thể truy cập vào chế độ xem chính knockout.jsModel từ một phương thức nằm ngoài phạm vi của chính viewModel hay không. Hãy ví dụ này:

function Employee(data) { 
    var self = this; 
    ko.mapping.fromJS(data, {}, this); 
} 

function EmployeeViewModel() { 
    var self = this; 
    this.employees = ko.observableArray([]); 

    this.loadEmployees = function() { 
    var mappedEmployees= $.map(JSON.parse(data.value), function(item) { return new Employee(item) }); 
    self.employees (mappedEmployees); 
    } 
} 

// here's the part I'm curious about 
$(document).ready(function() { 
    ko.applyBindings(new EmployeeViewModel()); 

    $("#myLink").click(function() { 
    // is there some way to get back into the ko context here? 
    // like with ko.dataFor or ko.contextFor? 
    }); 
} 

Answer 1

Bạn luôn có thể truy cập vào nó chỉ bằng cách lưu trữ viewmodel của bạn trong một biến, bạn có thể truy cập, các module and revealing module patterns là tốt đẹp, nhưng bạn chỉ có thể lưu trữ nó trong một đối tượng mà sẽ không xung đột với các tên khác ('tôi' ở đây):

my = { viewModel: new EmployeeViewModel() }; 
ko.applyBindings(my.viewModel); 

bạn đã có ý tưởng đúng, bạn chỉ cần phải thực hiện nguyên tố này như một cuộc tranh cãi với chức năng nhấp chuột của bạn và vượt qua thuộc tính mục tiêu để ko.dataFor hoặc ko.contextFor (jsfiddle) :

$(document).ready(function() { 
    my.vm = new EmployeeViewModel(); 
    ko.applyBindings(my.vm); 
    $('button').on('click', function(e) { 
     alert('you clicked on employee ' + ko.contextFor(e.target).$data.name() + 
      ' also known as ' + ko.dataFor(e.target).name()); 
    }); 
});​ 

Thay vì sử dụng jQuery để ràng buộc sự kiện nhấp chuột, bạn luôn có thể sử dụng the Knockout click binding, mà chuyển dữ liệu mô hình hiện tại như là tham số đầu tiên và sự kiện như tham số thứ hai (jsfiddle):

function EmployeeViewModel() { 
    var self = this; 

    // skipped some of your code 

    this.clickedOnEmployee = function(model, event) { 
    // assuming your Employee has a name observable 
    alert('You clicked on employee ' + model.name()); 
    }; 
} 

Trong html của bạn ($ root là mô hình khung nhìn cơ sở của bạn, bạn sẽ không cần nó nếu chức năng clickOnEmployee của bạn nằm trong đối tượng Employee của bạn):

<ul data-bind="foreach: employees"> 
    <li> 
     <span data-bind="text: name"></span> 
     <button data-bind="click: $root.clickedOnEmployee">show</button> 
    </li> 
</ul>