He creado dos variables observables en Knock Out de la siguiente manera:
self.winImage1= ko.observable(); self.winImage2= ko.observable();Y CSS basado en la plataforma validada y almacenada para las variables observables en JS de la siguiente manera:
self.findOperatingSystem = function (data) { if (navigator.appVersion.indexOf("Win") != -1) { data.winImage1("window_icon_1_css"); data.winImage2("windows_icon_2_css"); } else if (navigator.appVersion.indexOf("Mac") != -1){ data.winImage1("mac_icon_1_css"); data.winImage2("mac_icon_2_css"); } }Y luego trató de agregar las variables observables a HTML como una clase de la siguiente manera:
<div class="some_class1" data-bind="visible: $root.DeviceModel.findOperatingSystem ($parent)"> <i data-bind="foreach: $data.winImage1()"></i> <i data-bind="foreach: $data.winImage2()"></i> </div>Pero obtengo un error al usar foreach. Alguien, por favor ayuda a identificar lo que estoy haciendo mal aquí. ¡Sospecha de un enlace de datos incorrecto!
Por favor ayúdame a solucionar esto.
El problema es que foreach no funciona así. Necesitará una matriz de observables para trabajar con él de la siguiente manera:
self.itemsArray = [ko.observable({ id: 1, name: 'image1'}), ko.observable({id:2, name:'image2'})]; self.winImages = ko.observableArray(itemsArray ); <div class="some_class1" data-bind="visible: $root.DeviceModel.findOperatingSystem($parent), foreach: winImages "> <i data-bind="attr: { id: $data.id}"></i>