Skip to content

Instantly share code, notes, and snippets.

Created October 23, 2012 12:50
Show Gist options
  • Star 27 You must be signed in to star a gist
  • Fork 6 You must be signed in to fork a gist
  • Save jrmoran/3938567 to your computer and use it in GitHub Desktop.
Save jrmoran/3938567 to your computer and use it in GitHub Desktop.
AngularJS - basic async request
var App = angular.module('App', []);
App.controller('TodoCtrl', function($scope, $http) {
$scope.todos =;
<!doctype html>
<html ng-app="App" >
<meta charset="utf-8">
<title>Todos $http</title>
<link rel="stylesheet" href="style.css">
<script>document.write("<base href=\"" + document.location + "\" />");</script>
<script src=""></script>
<script src="app.js"></script>
<body ng-controller="TodoCtrl">
<li ng-repeat="todo in todos">
{{todo.text}} - <em>{{todo.done}}</em>
[{ "text":"learn angular", "done":true },
{ "text":"build an angular app", "done":false},
{ "text":"something", "done":false },
{ "text":"another todo", "done":true }]
Copy link

hey nice post! I'm an angular newbie and I assigned myself a little test, to help me learn angular. For learning, I'm creating an open source ruby on rails application that I will post on github when I finish the initial version. It's going to be an NFL Weekly Pickem using Ruby on Rails, AngularJS, and Twitter-Bootstrap . I feel like I can learn a ton building this project. Anyways! I was able to find a nice JSON file of the entire NFL 2013 schedule. I'm trying to figure out how to parse through it, because the JSON output has so many different hashed objects, inside of hashed objects, inside of more hashed objects. is the JSON I am working with. I have some snippets on plnkr of me trying to creating client objects with angular (I used your example above!). I'm just trying to get a good feel of parsing and creating objects. Once I get that down, I have some UI bootstrap switch sliders/pickers that I want to users to click on for their weekly picks, and later I want to add some pagenation for each weeks pickem. With Rails I'll let people create their own pickem groups and manage user / group creations inside rails. That's later though, first I need to parse through this big JSON file locally in angularjs. Any advice is much appreciated!

--yikes, I spent the past 2 hrs playing with it, doing ng-repeat inside the next object, I think I got it working somewhat to what I want. I keep playing with it if you ever happened to have time and look at it let me know if maybe there's a better way thanks!

Copy link

PatD commented Nov 15, 2014

This was tremendously helpful. Thanks for posting!

Copy link

dcaponi commented Jul 1, 2016

Short, sweet, to the point. Thank you!

Copy link

How to combine this three code??

Copy link

idbytes commented Jan 28, 2017

These all are already connected by controller name and json file name, only instead of todos.json inside get full path of the file should be given.

Copy link

guicuton commented Jul 2, 2018

I'm not quite sure if this is async request because if you put this on webserver and try to execute another action, the server will not respond your command until the $http request done and the then(res) get some results.

To work with a real async request with angular, its important read about promises and $q to handle async calls.
Here a link with a beautiful and simple digest about this -

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment