title: Typescript with angular2 and grunt error TS2304: Cannot find name
body: <p>In my angular2 Project am using grunt to automate compile my typescript files.</p>
  
  <p>All is doing well my files are compiling but am always getting errors </p>
  
  <pre><code>app/webapp/ng2/audit_logs/auditLogs.ts(2,3): error TS2304: Cannot find name 'app'.
  app/webapp/ng2/audit_logs/auditLogs.ts(3,3): error TS2304: Cannot find name 'http'.
  app/webapp/ng2/audit_logs/auditLogs.ts(3,10): error TS2304: Cannot find name 'ng'.
  app/webapp/ng2/audit_logs/auditLogs.ts(6,3): error TS2304: Cannot find name 'app'.
  app/webapp/ng2/audit_logs/auditLogs.ts(7,5): error TS2304: Cannot find name 'ng'.
  app/webapp/ng2/main.ts(16,24): error TS2304: Cannot find name 'upgradeAdapter'.
  </code></pre>
  
  <p>I've tried <a href="https://github.com/DefinitelyTyped/DefinitelyTyped" rel="nofollow">Definetlytyped</a> but am not getting success.</p>
  
  <p>I don't know why?</p>
  
  <p>Please help me to fix this below is my <code>main.ts and auditLogs.ts</code> files take a look and let me know where am doing wrong</p>
  
  <p><strong>Main.ts file</strong></p>
  
  <pre><code>/// &lt;reference path="../../../node_modules/angular2/typings/browser.d.ts" /&gt;
  
  
  var window: any = {
      giddh: undefined
  };
  
  import {UpgradeAdapter} from 'angular2/upgrade';
  
  var adapter = new UpgradeAdapter();
  var app = window.giddh.webApp;
  
  adapter.bootstrap(document.body, ['giddhWebApp']);
  
  // downgrade ng2 components to ng1 directives
  app.directive('myApp', upgradeAdapter.downgradeNg2Component(app.AppComponent));
  </code></pre>
  
  <p><strong>auditLogs.ts file</strong></p>
  
  <pre><code>(function(giddh: any) {
    app = giddh.webApp
    http = ng.http
  
  
    app.AppComponent =
      ng.core.Component({
        selector: 'my-app',
        templateUrl: ''
      }).Class({
        constructor: function(http: any) {
          this.test = new test(1020);
        }
      });
  
    class test {
      val: string;
      constructor(data: any){
        this.val = data;
      }
    }
  
  })(window.giddh || (window.giddh = {}));
  
  var window: any = {
    giddh: undefined
  }
  declare var require: any;
  import {Component} from 'angular2/core';
  
  @Component({
      selector: 'my-app',
      template: '/public/webapp/ng2/audit_logs/audit-logs.html'
  })
  
  export class AppComponent { 
  }
  </code></pre>