title: NG2 won't build with constructor (http: Http), unexpected token
body: <p>I am trying to get a webpage with a working button, to use that button to send out a http request.  I have angular http installed and declared in the module.  This is the error I get</p>
  
  <pre><code>11 | @Injectable()
    12 | export class LoadButton {
  &gt; 13 |   constructor(private http: Http) {
       |                       ^
    14 |   }
    15 |   clicked(event) {
    16 |     console.log(this.http.get)
  
  npm ERR! Linux 4.4.0-38-generic
  npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "run" "build"
  npm ERR! node v6.7.0
  npm ERR! npm  v3.10.3
  npm ERR! code ELIFECYCLE
  npm ERR! random-quote@1.1.1 build: `babel src -d app`
  npm ERR! Exit status 1
  npm ERR! 
  npm ERR! Failed at the random-quote@1.1.1 build script 'babel src -d app'.
  npm ERR! Make sure you have the latest version of node.js and npm installed.
  npm ERR! If you do, this is most likely a problem with the random-quote package,
  npm ERR! not with npm itself.
  npm ERR! Tell the author that this fails on your system:
  npm ERR!     babel src -d app
  npm ERR! You can get information on how to open an issue for this project with:
  npm ERR!     npm bugs random-quote
  npm ERR! Or if that isn't available, you can get their info via:
  npm ERR!     npm owner ls random-quote
  npm ERR! There is likely additional logging output above.
  
  npm ERR! Please include the following file with any support request:
  npm ERR!     /home/drew/Dropbox/js/sideProjs/redditTime/npm-debug.log
  </code></pre>
  
  <p>the file causing the error is </p>
  
  <pre><code>import { Component } from '@angular/core';
  import { Injectable } from '@angular/core';
  import { Http } from '@angular/http';
  
  @Component ({
      selector: 'buttonTest',
      template: `
      &lt;button (click)='clicked($event)'&gt;Test Button&lt;/button&gt;
      `
  })
  @Injectable()
  export class LoadButton {
    constructor(private http: Http) {
    }
    clicked(event) {
      console.log(this.http.get)
    }
  }
  </code></pre>
  
  <p>system config is mentioned in a few stack overflow posts but it doesn't seem to be incorrect</p>
  
  <pre><code>(function() {
    // map tells the System loader where to look for things
    var map = {
      'app': 'app',
      '@angular': 'node_modules/@angular',
      'rxjs': 'node_modules/rxjs'
    };
    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
      'app': { main: 'main.js',  defaultExtension: 'js' },
      'rxjs': { defaultExtension: 'js' }
    };
    var ngPackageNames = [
      'common',
      'compiler',
      'core',
      'forms',
      'http',
      'platform-browser',
      'platform-browser-dynamic',
      'router'
    ];
    ngPackageNames.forEach(function(pkgName) {
      packages['@angular/'+pkgName] = { main: 'bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
    });
    var config = {
      map: map,
      packages: packages
    };
    System.config(config);
  })();
  </code></pre>
  
  <p>Any ideas?  Not sure what I missed that is causing this error.</p>