Разница между setTimeout в javascript и $timeout в angularjs

Я новичок в угловой платформе. Вот мой сценарий, в котором я хочу изменить свою переменную $ scope.variable через некоторое время, поэтому я использовал метод setTimeout javascript.

$scope.variable = 'Previous';

setTimeout(function(){
  $scope.variable='NEXT';
},3000);

Этот код не работает для меня. Я использовал $apply() чтобы этот код работал.

Позже я узнал, что у angular есть служба $ timeout, которая выполняет ту же работу.

$scope.variable = 'Previous';

$timeout(function () {
  $scope.variable = 'NEXT';
}, 2000);

Как я могу сравнить производительность службы $timeout с javascript setTimeout??

Почему мы должны использовать $timeout вместо setTimeout??

Пожалуйста, дайте мне несколько примеров и причин, чтобы использовать его, который показывает производительность.

Спасибо :)

Ответы

Ответ 1

В некоторых случаях требуется выполнить некоторую операцию таймаута, и мы часто достигаем этого с помощью функции JavaScript setTimeout().

Однако, если мы используем setTimeout() в приложении AngularJS, нам также нужно использовать $scope.$apply(), чтобы любые изменения в scope отражались в другом месте (т.е. привязаны к данным в view).

AngularJS предоставляет удобную оболочку для этого: $timeout() - он имеет $apply(), для которого мы не должны $apply изменять.

Относительно производительности .

Если вы используете $timeout для создания того, что является по существу интервалом, то не используйте его. Если ваше приложение велико, тогда $apply также запускает цикл $digest, который вы, возможно, не хотите, чтобы это произошло, оно, безусловно, снизит производительность.

Ответ 2

Любая переменная области AngularJS при обработке извне (включая ajax) нуждается в $apply().

$timeout() заботится о текущей области и запускается в том же цикле дайджест после завершения обнаружения изменений.

Одна красота $timeout(), которую я недавно обнаружил, - если вы не пройдете параметр времени, он будет ждать завершения DOM.

Итак,

$timeout(function(){
  console.log("show after directive partial loaded")
}); //note, no time parameter

Запустите этот код в директиве, и функция обратного вызова таймаута будет запущена после частичной загрузки директивы

Надеюсь, что это поможет.