Having difficulty injecting $timeout into an AngularJS controller within the app

Recently, I've started working with Angular JS on a game development project. One of the requirements is to call a function after a timeout. After some research, I found out about the $timeout feature provided by AngularJS, so I tried injecting it into the controller. However, for some reason, it doesn't seem to be working as expected. I'm not sure what's wrong or how to go about debugging this issue?

 var ObstacleApp = angular.module('ObstacleApp', [])
 .controller('GameCtrl',function($scope,$timeout,game) {
 $scope.game = game;
 });

 ObstacleApp.factory('game', function() {
 var tileNames = ['true', 'false', 'true', 'false', 'true','true','true','false','true','true','true','false','true','true','true','true','true','true','true','true'];

 return new Game(tileNames);
 });


  function Game(tileNames)
  {
     // omitted code

     this.showOnClick = function()
     {
       // omitted code

       $timeout(callOnTimeout,6000);
     }
  }

Edit: I have followed the suggestions from @STEVER but unfortunately, the issue persists.
Upon inspecting the console, I encountered the following error:

Error: Unknown provider: $timeoutProvider <- $timeout
at Error (native)
at file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:2492:15
at Object.getService [as get] (file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:2620:39)
at file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:2497:45
at getService (file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:2620:39)
at invoke (file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:2650:13)
at Object.instantiate (file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:2677:23)
at file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:4354:24
at file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:3986:17
at forEach (file:///home/rakshith/Desktop/Obstaclegame/lib/angular/angular.js:118:20)(anonymous function) @ angular.js:5240
javascriptangularjsdependency-injection

Answer №1

Make sure you include the $timeout injection in your factory code:

ObstacleApp.factory('game', function($timeout) {

Answer №2

 In the ObstacleApp module, there is a factory called 'game' that defines a new game using the Game constructor function. The Game constructor takes in an array of tile names and the $timeout service as its arguments.

In the Game constructor, there is a method called showOnClick which performs certain actions and sets a timeout using the $timeout service to call a function named callOnTimeout after 6000 milliseconds.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Undefined arguments are causing issues in the Local Directive Vuejs

I'm struggling to properly set up a directive in Vue.js by following an example I found online. <div id="hook-arguments-example" v-demo:foo.a.b="message"></div> Here's the directive within the main Vue App code: const app = new ...

javascriptvue.js

What is the manual way to initiate the onclicksubmit event in jqgrid?

Is there a way to manually trigger the onclicksubmit event in jqgrid? If a certain condition is met, I need to programmatically call the submit event. See the code snippet below for reference. afterShowForm: function (formid) { if (condition) { ...

javascriptjqueryjqgrid

An Illustrative Example of Inheritance in Javascript?

I've been searching on various platforms for a straightforward example of inheritance without much luck. The examples I've come across are either too complex, obscure, or just not user-friendly. I have multiple service functions that all share so ...

javascriptjquery

Ways to obtain every image placed onto an element

Using the img tag within div.image-block sets a background. Images can be added to .block3 through drag and drop. Is there a way to create a container that includes all elements from .image-block? <style> .image-block { position: relat ...

javascriptjquery

ajax - unable to fetch information from the same domain

UPDATE: The solution provided by Cavid Kərimov indeed works. By setting the form as shown below, it also resolves the issue. <form onsubmit="return false;"></form> I am attempting to fetch a simple text string from a PHP file using jQuery an ...

javascriptphpjqueryajax

Associating specific information with individual elements utilizing HTML text box

Seeking guidance on implementing annotations feature for a scatter-plot using d3.js v3. My goal is to show a text-box upon clicking each data point, then display that entered text as a tool-tip specific to that data point. Here's how I'm approach ...

javascripthtmlangularjsd3.js

Convert the information within the data variable into a well-formatted JSON structure

I am attempting to transmit JSON information to the server utilizing the following URL: . The data variable is being populated with valid JSON containing properties such as name, email, and URLs. ...

jqueryjsonangularjspost

The `stream.Transform.unshift()` method in Node.js

Let's take a look at this simple example: stream = require 'stream' util = require 'util' class TestTransform extends stream.Transform _transform: (chunk, encoding, callback) -> if not @noMore @noMore ...

javascriptnode.jsstreamcoffeescript

Can anyone provide guidance on creating a Jest test for an authenticated Express endpoint?

I have been working on a seemingly straightforward 4-file toy solution that I thought was simple. I am looking to write a Jest test for the '/bingo' route in bingo.js which requires authentication. Below are the four files that make up this setup ...

javascriptexpressunit-testingauthenticationjestjs

Manipulate the DOM elements within the ng-repeat directive

Hello, I am currently new to AngularJS and have just begun learning how to create directives. While working on a sample project, I encountered an issue with accessing DOM elements rendered inside my directive. Some elements were not accessible in the link ...

javascriptangularjsdomangularjs-ng-repeat

Is it necessary to uncheck the row checkbox when inputs are left empty after blurred?

Two issues have cropped up here. When clicking on an input within a row, the corresponding checkbox should be checked. Currently, only the first text input is able to check the checkbox due to the use of .prev(). Is there a different approach that can be t ...

javascriptjquerycheckboxeachblur

Obtain a numerical output from a selection of numbers

I am facing a simple problem that I can't solve due to my lack of knowledge and have not been able to find any solution online. What I want to achieve is: Create a "value 1" from an array of integers. Generate a random "value 2". Check if the rando ...

javascriptphpencryptionhash

Accessing and parsing JSON data from directories within directories

My file directory structure is dynamic, with only the name of $(Root Directory) known at runtime. All folders and files are generated dynamically, with all files being in .json format. I am looking to count the number of files and read the content of eac ...

javascriptjqueryajaxjsonfile

What is the best way to position a rectangle on top of a div that has been rendered using

I recently started using a waveform display/play library known as wavesurfer. Within the code snippet below, I have integrated two wavesurfer objects that are displayed and positioned inside div elements of type "container". My goal is to position my own ...

javascripthtmlcsswavesurfer.js

Encountering an unidentified entity within a ReactJS application

Within a container, I've included a search bar inside a form element with two inputs - from and to, along with a submit button. Upon submitting the form, I create an OBJECT named query which looks like this: const query = { from : this.s ...

javascriptreactjs

Tips on effectively utilizing a function within middleware in Node.js

I've successfully used the checkAuth function with this format: router.get('/login', checkAuth, function(){ }) Now I'm wondering how to utilize the checkAuth function with this format: routes file router.get('/login', con ...

javascriptnode.jsmongodbexpress

Real-time update of quiz results based on varying factors

In my quiz, I have set up variables that start at 0 and increase based on certain conditions. One variable should increase when a question is answered correctly, while the other should increase when a question is answered incorrectly. If you answer a quest ...

javascriptjqueryhtmlcss

Issues persist with AJAX call to servlet

Recently, I encountered an issue with my servlet when attempting to insert form input fields into the database. The servlet was working fine when utilizing the following code: <form action="CreateUserServlet"> However, upon implementing some form v ...

javascriptjavajqueryajaxservlets

Node.js - Synchronize asynchronous calls to ensure coordinated execution in code

I am trying to figure out how to make a for loop with an async function wait until all the async functions called within it are finished before allowing the code to continue. In my scenario, I have a variable "bar" that contains a JSON array with other ne ...

javascriptnode.jsloopsasynchronousnpm

Issue with Dropdown Menu functionality while using multiple dropdown options

I am currently experimenting with dropdown menus from W3Schools and have encountered an issue when trying to implement two dropdown options. The code works fine for a single dropdown, but when I try to add a second one using GetElementsByClassName instead ...

javascripthtmlcsstwitter-bootstrap