Tengo un objeto dentro de viewModel donde la propiedad "visible" tendrá el valor de la variable loadingVisible declarada dentro de viewModel como observable.
Mi problema es que siempre recibo el siguiente error: No se pueden leer las propiedades de undefined (leyendo 'loadingVisible');
He intentado de varias formas pero sigo teniendo el mismo error, hay alguna solución?
var viewModel = { loadingVisible: ko.observable(false), loadOptions: { visible: viewModel.loadingVisible(), showIndicator: true, showPane: true, shading: true, hideOnOutsideClick: false, shadingColor: 'rgba(0,0,0,0.4)', }, }; return viewModel;
HTML
<div class="loadpanel" data-bind="dxLoadPanel: loadOptions"></div>
La forma más fácil que conozco es tener una propiedad a la que ambas cosas puedan hacer referencia.
var loadingVisible = ko.observable(false); var viewModel = { loadingVisible: loadingVisible, loadOptions: { visible: loadingVisible, showIndicator: true, showPane: true, shading: true, hideOnOutsideClick: false, shadingColor: 'rgba(0,0,0,0.4)', }, toggleVisible: function(){ loadingVisible(!loadingVisible()); } }; ko.applyBindings(viewModel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> <div class="loadpanel" data-bind="visible: loadOptions.visible"> <ul><li>Test</li></ul> </div> <button data-bind="click: toggleVisible">Press Me</button>