У меня есть следующая настройка div, где я переключаюсь между загрузочным div и угловым видом. Только блок загрузки должен отображаться, когда globalCtx.viewportLoading == true
, и только ng-view должен отображаться, когда globalCtx.viewportLoading == false
:
<div id="viewContainer">
<div class="loader" ng-if="globalCtx.viewportLoading"></div>
<div ng-view ng-if="!globalCtx.viewportLoading"></div>
</div>
Переменная globalCtx определена в службе angular следующим образом:
app.factory("globalCtx", function () {
var service = {
viewportLoading: false
};
return service;
});
На каждом маршруте у меня есть другой вид и другой угловой контроллер. Для каждого из этих представлений я показываю блок загрузки, пока страница не загрузится следующим образом:
Создать запрос
var req = {
method: 'POST',
url: 'api/v1/work/do-something',
data: request,
headers: {
'Content-Type': "application/json; charset=utf-8"
}
}
Установите для загрузки значение True
globalCtx.viewportLoading = true
Отправить запрос и установить для viewportLoading значение false в ответ
$http(req).then(function (resp) {
// ... do something ...
globalCtx.viewportLoading = false
},
function (resp) {
alert('Error fetching data from server!');
});
Это работает для первой страницы, на которой я работаю. Скажем, главная страница. Но любая страница, на которую я перехожу после этого, просто продолжает обновлять эту страницу. Скажем, я иду на главную страницу. Он делает один запрос данных. Затем я перенаправляюсь на страницу1 и замечаю, что контроллер angular для страницы1 продолжает обновляться и создается снова и снова. Почему это? Это связано с ng-if
?