ReferenceError: $setTimeout is not defined

Question

I'm currently doing a course and ran across and error. I'm making a tinder for producthunt using Ionic and Angular.

ionic $ 0     776918   error    ReferenceError: $setTimeout is not defined
    at Scope.$scope.sendFeedback (http://localhost:8100/js/controllers.js:41:5)
    at fn (eval at <anonymous> (http://localhost:8100/lib/ionic/js/ionic.bundle.js:26457:15), <anonymous>:4:239)
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:62386:9
    at Scope.$eval (http://localhost:8100/lib/ionic/js/ionic.bundle.js:29158:28)
    at Scope.$apply (http://localhost:8100/lib/ionic/js/ionic.bundle.js:29257:23)
    at HTMLAnchorElement.<anonymous> (http://localhost:8100/lib/ionic/js/ionic.bundle.js:62385:13)
    at HTMLAnchorElement.eventHandler (http://localhost:8100/lib/ionic/js/ionic.bundle.js:16583:21)
    at triggerMouseEvent (http://localhost:8100/lib/ionic/js/ionic.bundle.js:2948:7)
    at tapClick (http://localhost:8100/lib/ionic/js/ionic.bundle.js:2937:3)
    at HTMLDocument.tapMouseUp (http://localhost:8100/lib/ionic/js/ionic.bundle.js:3013:5)

This is my console log from ionic serve when i run the animation. Heres my code

angular.module('thunder.controllers', ['ionic', 'thunder.services'])

.controller('DiscoverCtrl', function($scope, $timeout) {
  $scope.products = [
    {
      "name": "LinkedIn ProFinder",
      "tagline": "A new way to hire freelancers from LinkedIn",
      "discussion_url": "https://www.producthunt.com/tech/linkedin-profinder-2",
      "thumbnail": "https://api.url2png.com/v6/P5329C1FA0ECB6/77fdeb2d4df2c4813d5c61384b22a33f/png/?thumbnail_max_width=850&url=https%3A%2F%2Fgoo.gl%2F1jUSIw",
      "product_url": "https://www.producthunt.com/r/0109266759e0f0/40894?app_id=1948"
    },
    {
      "name": "K Blocker",
      "tagline": "Kardashian content blocker for iOS",
      "discussion_url": "https://www.producthunt.com/tech/k-blocker",
      "thumbnail": "https://api.url2png.com/v6/P5329C1FA0ECB6/d7a68a8f35cda14414482f82a266e4ac/png/?thumbnail_max_width=850&url=http%3A%2F%2Fkblocker.co",
      "product_url": "https://www.producthunt.com/r/1239ed9df03056/40854?app_id=1948"
    },
    {
      "name": "HangoverApp",
      "tagline": "Share photos with friends, only visible when you're together",
      "discussion_url": "https://www.producthunt.com/tech/hangoverapp",
      "thumbnail": "https://api.url2png.com/v6/P5329C1FA0ECB6/f05f2b63763cc446bef17ba748c9e14a/png/?thumbnail_max_width=850&url=http%3A%2F%2Fwww.hangoverapp.com",
      "product_url": "https://www.producthunt.com/r/8a94554894f2bb/40912?app_id=1948"
    },
    {
      "name": "43 Layers",
      "tagline": "Teespring for event decorations and gifts",
      "discussion_url": "https://www.producthunt.com/tech/43-layers",
      "thumbnail": "https://api.url2png.com/v6/P5329C1FA0ECB6/ec770fa05c7ce60a4e07ccc074dddf28/png/?thumbnail_max_width=850&url=https%3A%2F%2Fwww.43layers.com%2Fproducts%2Fspecial%2FProduct-Hunt",
      "product_url": "https://www.producthunt.com/r/b704ae84e992e1/41413?app_id=1948"
    }
  ];
  $scope.currentProduct = angular.copy($scope.products[0]);

  $scope.sendFeedback = function(bool) {

    $scope.currentProduct.rated = bool;
    $scope.currentProduct.hide = true;

    $setTimeout(function () {
      var randomProduct = Math.round(Math.random() * ($scope.products.length - 1))

      $scope.currentProduct = angular.copy($scope.products[randomProduct]);
    }, 250);

  }
})
.controller('FavouritesCtrl', function($scope) {})
.controller('Tabs Ctrl', function($scope) {})

I've been trying to solve this error for the past hour, I'd highly appreciate the help!

Answer 1

Not sure if $setTimeout is an angular service. Try using $timeout instead.

AngularJs version of setTimeout is $timeout and setInterval is $interval .

See official documentation for more details: https://docs.angularjs.org/api/ng/service/$timeout

Answer 2

There is no service in angular for timeout named $setTimeout

Convert this

$setTimeout

to this

$timeout

in this line

$setTimeout(function () {
  var randomProduct = Math.round(Math.random() * ($scope.products.length - 1))

  $scope.currentProduct = angular.copy($scope.products[randomProduct]);
}, 250);

Answer 3

I believe your syntax is incorrect. Use the js setTimeout or angular $timeout not $setTimeout from what I remember.