title: Having trouble exporting from an Angular2 module
body: <p>I'm a beginner with Angular 2, and am trying to understand how to export a class from a feature module, and import it into my main module.</p>
  
  <p>When I try to compile this in typescript, I receive the following two errors:</p>
  
  <ul>
  <li><p>app/app.component.ts(11,21): error TS2304: Cannot find name
  'AddService'. </p></li>
  <li><p>app/app.module.ts(4,9): error TS2305: Module
  '"C:/angular/app/add/arithmetic.module"' has no exported member
  'AddService'.</p></li>
  </ul>
  
  <p>my tree is simple:</p>
  
  <pre><code>/
    index.html
    package.json
    systemjs.config.js
    tsconfig.json
    typings.json
    app/
       app.component.html
       app.component.ts
       app.module.ts
       main.ts
       add/
          add.service.ts
          arithmetic.module.ts
  </code></pre>
  
  <p>The interesting parts are below:</p>
  
  <p>app.module.ts:</p>
  
  <pre><code>import {NgModule}      from '@angular/core';
  import {BrowserModule} from '@angular/platform-browser';
  import {AppComponent}   from './app.component';
  
  // this next line generates an error from typescript compiler:
  // app/app.module.ts(4,9): error TS2305: Module
  // '"C:/angular/app/add/arithmetic.module"' has no exported 
  // member 'AddService'.
  
  import {AddService} from './add/arithmetic.module';
  
  @NgModule({
      imports:        [BrowserModule],
      declarations:   [AppComponent, AddService],
      bootstrap:      [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>app.component.ts</p>
  
  <pre><code>import { Component } from '@angular/core';    
  
  @Component({
      selector: 'my-app',
      templateUrl: 'app/app.component.html'
  })
  export class AppComponent {
  
      calculate() {
          // this next line generates the error:
          // app/app.component.ts(11,21): 
          // error TS2304: Cannot find name 'AddService'.
          var c = new AddService();
  
          var x = c.addTwoNumbers(3, 5);
          console.log(x);
      }
  }
  </code></pre>
  
  <p>arithmetic.module.ts</p>
  
  <pre><code>import {NgModule}            from '@angular/core';
  import {CommonModule}        from '@angular/common';
  import {AddService}          from './add.service';
  
  @NgModule({
    imports: [CommonModule],
    exports: [AddService]
  })
  export default class ArithemeticModule { }
  </code></pre>
  
  <p>add.service.ts</p>
  
  <pre><code>export class AddService {
      addTwoNumbers(a: number, b: number) : number {
          return a + b;
      } 
  }
  </code></pre>
  
  <p>This really is frustrating because </p>
  
  <p>1) I'm exporting AddService -- it's marked as 'export' and from within ArithmeticModule I'm marking it as exported using the @NgModule metadata.</p>
  
  <p>2) I'm importing the [allegedly] exported AddService class from within my main module, so the AddService should be usable since it's exported from the ArithmeticModule</p>
  
  <p>It works fine if I import the AddService directly from within the component, but that's not what I'm going for: I want to import the class from my main module, and utilize the exports from that module, just like we do for Angular's modules (e.g., BrowserModule and FormsModule). The documentation for @NgModule says that we should be able to do just that - import once from my feature module, into my main module, and then it's usable throughout the main module.</p>
  
  <p>Can someone tell me what I'm doing wrong? Or am I misunderstanding what modules are supposed to be used for?</p>