Как остановить $ ionicLoading при выполнении обещания?

Question

Я сделал ionicLoading и использовал ту же функцию - startNow(), чтобы перейти от original-page к my-next-page.

Впервые я позвоню startNow() и отправляется непосредственно в my-next-page после того, как $timeout() позвонил в службу поддержки.

Вот моя реальная проблема:

У меня есть кнопка отмены на моем myLoadingTemplate.html и я называю ту же функцию startNow(true). Проблема заключается в том, что после нажатия кнопки отмены во время загрузки страница была перенаправлена ​​на мой original-page. Однако после 2500 мс страница все еще перенаправляется на my-next-page.

Как решить эту проблему?

$scope.startNow = function(is_force) 
{ 
    if(is_force===true) 
    { 
     $state.go('orignal-page'); 
     $ionicLoading.hide(); 
    }else 
    { 
     $ionicLoading.show({ 
      templateUrl: "myLoadingTemplate.html", 
      nBackdrop: false 
      }).then(function(){ 
        $timeout(function(){ 

         $state.go('my-next-page'); 
         $ionicLoading.hide(); 

        },2500); 
     }); 
    } 
} 

Answer 1

Так что, если я получу ваше право, вы не сможете предотвратить изменение состояния с задержкой после таймаута при отмене. Это можно сделать, фактически отменив таймаут. $ timeout возвращает обещание, которое вы можете сохранить, чтобы отменить его, нажав кнопку отмены.

Модифицированный код ниже, надеюсь, что это делает трюк, как вы ожидаете, что это будет :)

Edit: Моя вина - $ ionicLoading.show не возвращает обещание, вызов неверен в данном случае, хотя. Исправьте его в приведенном ниже примере кода. Также я изменил $ scope.transitionTimeout на $ rootScope.transitionTimeout (СОВЕТ: Да, использование $ rootScope не очень чистое, это был самый быстрый способ проиллюстрировать рабочий пример здесь). Проблема заключается в том, что не просто передать сферу в службу $ ionicLoading, поэтому, когда вы добавите контроллер в шаблон загрузки, будет создана новая область, в которой обещание transitionTimeout не определено.

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

Однако: Ниже приведен быстрый и рабочий пример. Вы также можете попробовать это прямо здесь: http://play.ionic.io/app/4349c868f8b4

$scope.startNow = function(is_force) 
{ 
    if(is_force===true) 
    { 
     // cancel your timeout by using the reference 
     // HINT: $rootScope implementation is not the cleanest solution here 
     //  should mainly illustrate a quick solution! E.g. a better solution 
     //  would be to implement a LoadingService, which stores such a 
     //  transition timeout promise uniquely 
     $timeout.cancel($rootScope.transitionTimeout); 

     $state.go('orignal-page'); 
     $ionicLoading.hide(); 
    }else 
    { 
     $ionicLoading.show({ 
      templateUrl: "myLoadingTemplate.html", 
      nBackdrop: false 
     }) 

     // store the promise here 
     $rootScope.transitionTimeout = $timeout(function(){ 
      $state.go('my-next-page'); 
      $ionicLoading.hide(); 
     }); 
    } 
}