feat(http): introduce http sample

Closes #9

Author: cironunes

src/app/angular2-playground.html

@@ -1,6 +1,7 @@
 <nav>
   <a href="#/" id="hello-link">Hello World</a> |
-  <a [routerLink]="['/NgUpgradeCmp']" id="upgrade-link">ngUpgrade</a>
+  <a [routerLink]="['/NgUpgradeCmp']" id="upgrade-link">ngUpgrade</a> |
+  <a [routerLink]="['/HttpSampleCmp']" id="upgrade-link">HTTP sample</a>
 </nav>
 
 <router-outlet></router-outlet>

src/app/angular2-playground.ts

@@ -7,6 +7,7 @@ import {
 
 import {HelloCmp} from './components/hello/hello';
 import {NgUpgradeCmp} from './components/ng-upgrade/ng-upgrade';
+import {HttpSampleCmp} from './components/http-sample/http-sample';
 
 
 @Component({
@@ -18,7 +19,8 @@ import {NgUpgradeCmp} from './components/ng-upgrade/ng-upgrade';
 })
 @RouteConfig([
   new Route({ path: '/', component: HelloCmp, name: 'HelloCmp' }),
-  new Route({ path: '/ng-upgrade', component: NgUpgradeCmp, name: 'NgUpgradeCmp' })
+  new Route({ path: '/ng-upgrade', component: NgUpgradeCmp, name: 'NgUpgradeCmp' }),
+  new Route({ path: '/http-sample', component: HttpSampleCmp, name: 'HttpSampleCmp' })
 ])
 export class Angular2PlaygroundApp {
 }

src/app/components/http-sample/http-sample.html

@@ -0,0 +1,3 @@
+<ul>
+  <li *ngFor="#suggestion of suggestions">{{ suggestion.login }}</li>
+</ul>

src/app/components/http-sample/http-sample.spec.ts

@@ -0,0 +1,27 @@
+import {
+  it,
+  iit,
+  describe,
+  ddescribe,
+  expect,
+  inject,
+  injectAsync,
+  TestComponentBuilder,
+  beforeEachProviders
+} from 'angular2/testing';
+import {provide} from 'angular2/core';
+import {HttpSampleCmp} from './http-sample';
+
+
+describe('HttpSample Component', () => {
+
+  beforeEachProviders(() => []);
+
+
+  it('should ...', injectAsync([TestComponentBuilder], (tcb:TestComponentBuilder) => {
+    return tcb.createAsync(HttpSampleCmp).then((fixture) => {
+      fixture.detectChanges();
+    });
+  }));
+
+});

src/app/components/http-sample/http-sample.ts

@@ -0,0 +1,24 @@
+import {Component} from 'angular2/core';
+import {CORE_DIRECTIVES} from 'angular2/angular2';
+
+import {Http, HTTP_PROVIDERS} from 'angular2/http';
+
+import 'rxjs/add/operator/map';
+
+@Component({
+  selector: 'http-sample',
+  templateUrl: 'app/components/http-sample/http-sample.html',
+  providers: [HTTP_PROVIDERS],
+  directives: [CORE_DIRECTIVES],
+  pipes: []
+})
+export class HttpSampleCmp {
+  suggestions;
+
+  constructor(private http: Http) {
+    this.http.get('http://api.github.com/users/cironunes/orgs')
+      .map((res) => res.json())
+      .subscribe((res) => this.suggestions = res); 
+  }
+
+}

src/index.html

@@ -6,13 +6,20 @@
   <script src="vendor/systemjs/dist/system.src.js"></script>
   <script src="vendor/angular2/bundles/angular2.dev.js"></script>
   <script src="vendor/angular2/bundles/router.dev.js"></script>
+  <script src="vendor/angular2/bundles/http.dev.js"></script>
   {{content-for 'head'}}
   <script>
     System.config({
+      map: {
+        'rxjs' : 'vendor/rxjs'
+      },
       packages: {
         app: {
           format: 'register',
           defaultExtension: 'js'
+        },
+        'rxjs': {
+          defaultExtension: 'js'
         }
       }
     });