Ноутаут js лучшие практики ajax обработка ошибок

Какие лучшие практики для Knockout js вы использовали, когда ответы ajax json возвращаются плохо.

Как вы создаете свои сопоставления для отображения ошибки, возникшей у пользователя? Как изменить привязку формы в Knockout js для размещения ошибок?

Я отправляю обратно объект ответа {response: "success", data: {}}, который означает, что существует 3 уровня ошибки:

Ошибка модели (ответ json-объекта на "отказ", с данными модели о том, какие поля были неправильными)
Ошибка сервера (без ответа с сервера)
Сервер отвечает кодом ошибки

Не выяснили, какой способ отображения в виде viewmodel отображает сообщение об ошибке, которое я спрашиваю.

Ответ 1

То, как я столкнулся с обработкой ошибок в KO, заключалось в создании базового класса:

errorHandlingViewModel = function () {
    var self = this;
    self.ErrorText = ko.observable();
    self.errorHandler = function (jqXHR, textStatus, errorThrown) {
        self.ErrorText('An error has occured, please refresh the page and try again in a little while. (' + textStatus + ':' + errorThrown + ')');
    };
    self.validationErrorHandler = function (err) {
        //todo
        alert('validation error ' + err);
    }
    self.successHandler = function (data, onSuccess) {
        if (data.result == "success") {
            if (onSuccess) {
                onSuccess(data.data);
            }
        }
        else {
            if (data.data && data.data.Tag) {
                if (data.data.Tag == "ValidationError") {
                    validationErrorHandler(data.data.Tag);
                }
            }
            errorHandler(null, data.result, data.data);
        }
    };
};

У этого есть наблюдаемое поле ErrorText.

Все мои ViewModels, которые нуждаются в этой обработке ошибок, могут использовать прототипное наследование:

viewModel.prototype = new errorHandlingViewModel();
var mainViewModel = new viewModel();
ko.applyBindings(mainViewModel, $("#locationTOApplyBindingTo")[0]);

В этом представлении модели ajax-вызовы выглядят следующим образом:

$.ajax({
    type: 'POST',
    url: myURL,
    data: myData,
    success: function (data) {self.successHandler(data,success);},
    error: self.errorHandler
}); //end ajax

Пользовательский интерфейс - это простое связывание данных:

<div class="error" data-bind="visible:ErrorText">
    <div class="innerMSGContainer">
        <div class="innerMSG" data-bind="text:ErrorText"></div>
    </div>
</div>

Javascript Try-Catch по-прежнему отсутствует в этой модели, так как я не уверен в размещении

Ответ 2

Лично я бы успел обновить модели нокаута. Это оставляет модели в том же состоянии, что и до ошибки.

В случае ошибки вы можете сделать все, что хотите сообщить пользователю, что произошла ошибка. Я хотел бы использовать humane.js, чтобы показать сообщение пользователю о том, что обновление или создание не удалось по какой-то причине. В трех случаях для ошибки модели, отсутствия реакции или ошибки сервера вы можете проверить состояние сообщения в функции ошибки и выбрать другое сообщение для отображения пользователю

Затем у них есть свобода повторить то же самое или исправить свою ошибку и повторить попытку.

$.post("somewhere")
.success(function() {
    // update knockout models here
})
.error(function() {
    // show error message to user
})
.complete(function() {
    // reset any temporary variables
});