Tạo ID trong vòng Knockout Foreach vòng

Question

Tôi đang cố gắng xây dựng một số HTML với Knockout rằng giao diện người dùng Jquery có thể biến thành toggle buttons. Những gì tôi cần đến là:

<div id="status"> 
    <input type="radio" id="status_ACTIVE" value="ACTIVE" name="status" /><label for="status_ACTIVE">Active</label> 
    <input type="radio" id="status_INACTIVE" value="INACTIVE" name="status" checked="checked" /><label for="status_INACTIVE">Inactive</label> 
</div> 

Sử dụng giao diện người dùng JQuery Tôi có thể dễ dàng biến thành nút chuyển đổi. Nhưng làm thế nào để tôi tạo ra điều đó mà không cần sử dụng các mẫu JQuery đã mất giá hiện nay? Đây là những gì tôi đã cố gắng để làm:

Bên trong mô hình javascript:

self.statuses = [{Selected:true,Text:"Active",Value:"ACTIVE"},{Selected:false,Text:"Inactive",Value:"INACTIVE"}]; 

Các đánh dấu:

<div id="status" data-bind="foreach: statuses"> 
    <input type="radio" name="status" data-bind="value: Value, id: 'status_' + Value" /><label data-bind="text: Text, for: 'status_' + Value"></label> 
</div> 

này không hoạt động. Tôi không nghĩ rằng nó thích cách tôi đang cố tạo ID đó, hoặc liên kết nó với vòng lặp for. Nó vẽ các nút không chính xác, vì hai nút độc lập và chức năng nhấp chuột không hoạt động.

Thậm chí nếu tôi chỉ chỉ định giá trị làm id như: id: Value và for: Value nó vẫn không hoạt động. Tôi có thể không đặt các thuộc tính này bằng cách loại trực tiếp không?

Answer 1

Thêm javascript này giải quyết vấn đề của tôi:

ko.bindingHandlers.id = { 
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
    }, 
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     $(element).attr('id', valueAccessor()); 
    } 
}; 

ko.bindingHandlers.forattr = { 
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
    }, 
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     $(element).attr('for', valueAccessor()); 
    } 
}; 

tôi đã phải thay đổi for: 'status_' + Value vào foratt: 'status_' + Value như for là một từ dành riêng.

Cập nhật: tôi có thể cũng đã sử dụng "attr" ràng buộc, như thế này:

attr: { for: 'status_' + Value }