Я новичок в angular.js. Я смущен тем, как обрабатывать асинхронные события в контроллере.Как обращаться с асинхронным в контроллере angular.js?

Например, на странице у меня есть вид с именем count. И пока я нажимаю на кнопку, контроллер увеличивает счет на 1. Но увеличение является асинхронным. Я хочу, когда count изменится, представление будет уведомлено и изменит его значение. Но используйте следующий щелчок, представление не изменит его значение.

Это код, например:

<!DOCTYPE html> 
<html ng-app> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> 
    </head> 

    <body> 
    <div ng-controller="Controller"> 
     {{ count }} 
     <form ng-submit="delayInc()"> 
     <input type="submit" value="Add" /> 
     </form> 
    </div> 

    <script> 
     function Controller($scope) { 
     $scope.count = 0; 

     $scope.delayInc = function() { 
      setTimeout(function() { 
      $scope.count += 1; 
      }, 1000); 
     }; 
     } 
    </script> 
    </body> 
</html>

Update:

Спасибо за все ваши ответы. Но я задаю вопрос. Как насчет функции setTimeout является HTTP-запрос? Я знаю, что $http может это сделать. Но что, если функция что-то обрабатывает файл и так далее? Я не исключаю, что у каждого асинхронного вызова есть услуга для меня. Нужно ли мне писать свой собственный, если доза не существует?

источник

2013-06-18 Bin Wang

, но когда вы заполните форму, тогда вся страница перезагружается, и вы никогда не увидите изменений переменной. – Cherniv

Используйте $timeout service вместо родного setTimeout:

function Controller($scope, $timeout) { 
    //      ^---- Don't forget to inject the service 
    $scope.count = 0; 

    $scope.delayInc = function() { 
     $timeout(function() { 
      $scope.count += 1; 
     }, 1000); 
    }; 
}

В качестве альтернативы, вы можете сказать, Угловое, чтобы применить изменения вручную с помощью Scope.$digest() (услуга $timeout показано выше, будет делать это эффективно для вас):

function Controller($scope) { 
    $scope.count = 0; 

    $scope.delayInc = function() { 
     setTimeout(function() { 
      $scope.count += 1; 
      $scope.$digest(); 
     }, 1000); 
    }; 
}

источник

2013-06-18 10:46:37

Спасибо. Я обновил свой вопрос. Не могли бы вы посмотреть, пожалуйста? –

@BinWang - Второй пример в моем ответе может применяться к общему случаю. Но я предлагаю использовать Угловые услуги там, где это возможно. Если вы хотите написать свой собственный, вы захотите использовать обещания - посмотрите на службу '' q q' (http://code.angularjs.org/1.1.5/docs/api/ng.$q) , –

Это то, что мне нужно. Спасибо за ответ! –

Из-за природы диапазона AngularJS $ вам необходимо заменить вызов setTimeout услугой $timeout.

источник

2013-06-18 10:47:47 lucassp

Как обращаться с асинхронным в контроллере angular.js?

Update:

ответ

Смежные вопросы