knockout-2.0

knockout 2.0 - Knockout-2.2.0, suscriba el valor antes del cambio Y el nuevo valor



knockout-2.0 (3)

Esto parece funcionar para mi

ko.observable.fn.beforeAndAfterSubscribe = function (callback, target) { var _oldValue; this.subscribe(function (oldValue) { _oldValue = oldValue; }, null, ''beforeChange''); this.subscribe(function (newValue) { callback.call(target, _oldValue, newValue); }); };

Enlace jsfiddle: http://jsfiddle.net/T8ee7/

Cuando llamo al método de suscripción de Knockout, ¿hay alguna manera de obtener tanto el valor anterior como el nuevo? En este momento, solo puedo llamar a obtener estos valores por separado. Quiero activar algún código si el valor antiguo y el nuevo son diferentes.

Supongo que podría hacer lo siguiente, pero puede causar problemas ... ( http://jsfiddle.net/MV3fN/ )

var sv = sv || {}; sv.PagedRequest = function (pageNumber, pageSize) { this.pageNumber = ko.observable(pageNumber || 1); this.numberOfPages = ko.observable(1); this.pageSize = ko.observable(pageSize || sv.DefaultPageSize); }; var _pagedRequest = new sv.PagedRequest(); var oldValue; _pagedRequest.pageNumber.subscribe(function (previousValue) { console.log("old: " + previousValue); oldValue = previousValue; }, _pagedRequest, "beforeChange"); _pagedRequest.pageNumber.subscribe(function (newValue) { console.log("new: " + newValue); if (oldValue != newValue) { console.log("value changed!"); } }); _pagedRequest.pageNumber(10); _pagedRequest.pageNumber(20); ​


Prefiero usar un extensor observable .

http://jsfiddle.net/neonms92/xybGG/

Extensor:

ko.extenders.withPrevious = function (target) { // Define new properties for previous value and whether it''s changed target.previous = ko.observable(); target.changed = ko.computed(function () { return target() !== target.previous(); }); // Subscribe to observable to update previous, before change. target.subscribe(function (v) { target.previous(v); }, null, ''beforeChange''); // Return modified observable return target; }

Ejemplo de uso:

// Define observable using ''withPrevious'' extension self.hours = ko.observable().extend({ withPrevious: 1 }); // Subscribe to observable like normal self.hours.subscribe(function () { if (!self.hours.changed()) return; // Cancel if value hasn''t changed print(''Hours changed from '' + self.hours.previous() + '' to '' + self.hours()); });


http://jsfiddle.net/MV3fN/3/

var sv = sv || {}; sv.PagedRequest = function (pageNumber, pageSize) { var self = this; self.pageNumber = ko.observable(pageNumber || 1); self.numberOfPages = ko.observable(1); self.pageSize = ko.observable(pageSize || sv.DefaultPageSize); self.pageNumber.subscribe(function (previousValue) { console.log(previousValue); console.log(self.pageNumber.arguments[0]); if (previousValue != _pagedRequest.pageNumber.arguments[0]) { console.log(''value changed''); } else { //This won''t get executed because KO doesn''t //call the function if the value doesn''t change console.log(''not changed''); } }, _pagedRequest, "beforeChange"); }; var _pagedRequest = new sv.PagedRequest(); _pagedRequest.pageNumber(10); _pagedRequest.pageNumber(20); _pagedRequest.pageNumber(20); _pagedRequest.pageNumber(5);

No sé si realmente se supone que debes usar arguments[0] , pero parece funcionar.

También puede configurar su propio método para lograr esto de una manera mucho más limpia:

http://jsfiddle.net/PXKgr/2/

... self.setPageNumber = function(page) { console.log(self.pageNumber()); console.log(page); if (self.pageNumber() != page) { console.log(''value changed''); } else { console.log(''not changed''); } self.pageNumber(page); }; ... _pagedRequest.setPageNumber(10); _pagedRequest.setPageNumber(20); _pagedRequest.setPageNumber(20); _pagedRequest.setPageNumber(5);