No description, website, or topics provided.
Switch branches/tags
Nothing to show
Clone or download
Pull request Compare This branch is 2 commits ahead of learn-co-students:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
js
tests
.learn
CONTRIBUTING.md
LICENSE.md
README.md
angular.js
app.js
index.html
karma.conf.js
package.json

README.md

Injecting a Service

Objectives

  • Create a $timeout that updates the View

Instructions

Let's inject one of Angular's built in services into our controller.

For this lab, we're going to make use of $timeout. $timeout allows us to create timeouts (similar to setTimeout) in our applications whilst ensuring that any changes to our model done inside a timeout gets reflected in the view.

$timeout accepts the same parameters as setTimeout - a function and an integer for how many milliseconds delay.

$timeout(function () {
	// this would be fired after 2 seconds!
}, 2000);

Fork and clone this repository to get started.

Let's create our controller inside ContactController.js, this should have two parameters - $scope and $timeout (it doesn't matter what order you put them in, if you don't believe me - try it!).

Attach the controller to our app module.

Now, inside our controller, set $scope.name to your name. We previously touched on using controllerAs, but as we need to use two simple services for this lab, we will be using $scope.

Below that, set a $timeout for 5 seconds. Inside the function, set $scope.name to something else.

Open up index.html and wait 5 seconds - you'll see the view get updated with our new name!