Я пытаюсь выяснить, где лучше всего выполнять длительную операцию загрузки с помощью Durandal.
Насколько я могу судить, общая рекомендация по загрузке данных содержится в методе ViewModel activate, что я обычно и делаю — что-то вроде:
viewModel.activate = function () {
var loadPromise = myService.loadData();
return $.when(loadPromise).then(function (loadedData) {
viewModel.data(data);
});
};
Я знаю, что если я не верну здесь обещание, то обычно возникают проблемы с привязками - как этот вопрос и ответ указывают.
Однако выполнение длительной операции загрузки в методе activate приводит к тому, что приложение «зависает» во время завершения операции загрузки. Например, что, если моя нагрузка теперь была примерно такой?
viewModel.activate = function () {
// All loads return a promise
var firstLoad = myService.loadFirstData();
var secondLoad = myService.loadSecondData();
var thirdLoad = myService.loadThirdDataWhichTakesAges();
return $.when(firstLoad, secondLoad, thirdLoad).then(function (one, two, three) {
viewModel.one(one);
viewModel.two(two);
viewModel.three(three);
});
};
В этом случае URL-адрес обновляется, чтобы отразить загружаемую страницу, но содержимое страницы по-прежнему показывает предыдущую страницу (это то, что я имею в виду под «зависаниями»).
В идеале было бы хорошо, если бы URL-адрес изменился на новую страницу, и содержимое страницы также должно отображать новую страницу (даже если данные для этой страницы еще не возвращены). Затем по мере возврата каждой операции загрузки соответствующая часть страницы должна обновляться, когда данные привязываются к модели представления.
Есть ли рекомендуемый способ достижения этого внутри Дюрандаля?
Мое текущее решение состоит в том, чтобы начать загрузку в методе activate, а затем заполнить данные в методе viewAttached:
var loadPromise;
viewModel.activate = function () {
// All loads return a promise
var firstLoad = myService.loadFirstData();
var secondLoad = myService.loadSecondData();
var thirdLoad = myService.loadThirdDataWhichTakesAges();
loadPromise = $.when(firstLoad, secondLoad, thirdLoad);
// Don't return the promise - let activation proceed.
};
viewModel.viewAttached = function () {
$.when(loadPromise).then(function (one, two, three) {
viewModel.one(one);
viewModel.two(two);
viewModel.three(three);
});
};
Кажется это работает, но я помню, что где-то читал, что полагаться на viewAttached было не лучшим решением. Я также не уверен, есть ли вероятность состояния гонки, поскольку я разрешаю активацию.
Любые другие рекомендации?
