Запустить счетчик на теге

Я хочу добавить счетчик, чтобы показать, что что-то происходит, потому что есть задержка между пользователем, нажимающим на призыв к действию, и следующей страницей на мобильном телефоне с медленным подключением. Приведенный ниже код работает на рабочем столе и в режиме эмуляции в Chrome, но не на устройстве iOS.

<a href = "www.mysite.com/next-page"
   ng-click = "showLoader();"
>Next Page</a>

<div id = "loadScreen" class = "load-screen" ng-show = "displayLoader">
    <div class = "spinner"></div>
</div>

В контроллере

$scope.displayLoader = false;

$scope.showLoader = function(event) {
    $scope.displayLoader = true;
}

Есть ли известная проблема с использованием ng-click по тегу привязки на мобильных устройствах? Что мне нужно сделать, чтобы это сработало? В атрибуте href на фактической базе кода есть логика php, поэтому я не хочу перемещать URL-адрес в контроллер.

stackoverflow.com/questions/34575510/…
James Hill 10.08.2018 13:31

@JamesHill - Спасибо - проблема в том, что счетчик не отображается. Теперь мне нужно поработать над тем, чтобы он работал для пользователей в приватном режиме.

D Williams 10.08.2018 15:16
Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
0
2
325
1

Ответы 1

Вы можете использовать window.location внутри себя, чтобы перейти к своему URL-адресу и удалить тег href из тега привязки.

<!DOCTYPE html>
<html>
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<style>
.spinner {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
</style>
<body>
<div ng-app = "myApp" ng-controller = "myCtrl">
<a ng-click = "showLoader();">Next Page</a>
<div id = "loadScreen" class = "load-screen" ng-show = "displayLoader">
    <div class = "spinner"></div>
</div>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.displayLoader = false;
    $scope.showLoader = function(event) {
        $scope.displayLoader = true;
        window.location = "www.mysite.com/next-page";
    }
});
</script>

</body>
</html>

У меня много логики php для создания строки запроса в href. Для рефакторинга кода и переноса построителя запросов в контроллер angular может потребоваться столько же усилий, сколько и на оптимизацию страницы для более быстрой работы, что устранит необходимость в счетчике.

D Williams 10.08.2018 15:20

Другие вопросы по теме