Мгновенное обновление бэкэнд с нокаутированием

Question

Я пытаюсь создать веб -страницу с формой, которая, как только пользователь изменяет любое поле, сразу же проверка и обновление, а не позволить пользователю нажать кнопку «Отправить». Я использую nockout.js и отображение плагина. Я знаю, что могу достичь этого, создав вычислительное поле для каждого оригинального поля, но такая работа - Тедиус и Тупой, есть ли хорошая практика, чтобы создать общего слушателя для прослушивания любых изменений в любых областях и обновлять бэкэнд соответственно?

Answer 1

Чтобы подписаться на любые изменения, вы можете использовать метод ko.tojs (). На самом деле это позволяет проходить через график объекта и развернуть наблюдаемые. Как вы, вероятно, знаете, когда вы используете KO.compet, он подписывается на все чтения поля Observables, и переоценивает все изменения. Так что, если вы используете код, как это:

ko.computed(function() {
   ko.toJS(viewModel);
   // update data on server
});

Также вы должны обратить внимание на то, что этот кусок кода будет обновлять данные на сервере сразу после инициализации. Этого можно легко избежать. Пожалуйста, проверьте этот пример: http://jsfiddle.net/uaxxa/embedded/result/

Также я думаю, что вы можете отправить только измененные данные на сервер. Вы можете включить плагин ko.editbales ( https://github.com/romanych/ko.editables и некоторые знания KO под капюшоном. Пожалуйста, проверьте этот пример: http://jsfiddle.net/romanych/rkn5k/

Я надеюсь, что это может вам помочь.

Answer 2

У вас есть несколько вариантов, но если вы хотите одного прослушивателя, один из хороших способов - использовать тот же код, который я использовал для создания трекера изменения. Это просто слушает наблюдаемые изменения. Это около 19 строк кода. Вы можете взять это и вместо того, чтобы использовать его для отслеживания изменений, просто подключите метод, который сохраняет изменения, когда они возникают.

• Nuget http://nuget.org/packages/knockout.changetracker
• Кодеплекс http://kochangetracker.codeplex.com/

Чтобы настроить отслеживание изменения, добавьте это свойство трекера в модель просмотра:

viewModel.tracker = new ChangeTracker(viewModel); 

Зацепите их в ваш взгляд, чтобы определить, когда происходят изменения:

viewModel.tracker().somethingHasChanged(); 

Зацепите это в свою модель просмотра, когда вы хотите сбросить состояние в функциях (например: загрузка, сохранение):

viewModel.tracker().markCurrentStateAsClean; 

При желании вы также можете передать свою собственную хэшфункцию для отслеживания состояний.