title: Angular2 Submodule Import Issue
body: <p>I have an issue with a submodule using NgSemanticModule. The module itself works without the NgSemantic tags inside the submodule components template. Trying to use the NgSemantig Components fails inside my submodule. If I use the HeaderComponent template in my AppComponent template the same code works. How to import the NgSemantic Module at the Header Module Level?</p>
  
  <p>Header Module:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { HeaderComponent } from "./header.component";
  import { NgSemanticModule } from "ng-semantic";
  
  
  @NgModule({
     declarations: [
     HeaderComponent
  ],
  imports: [
   NgSemanticModule
  ],
  providers: [],
  exports:[
    HeaderComponent
   ]
  })
  
  export class HeaderModule { }
  </code></pre>
  
  <p>Header Component:</p>
  
  <pre><code> import { Component } from '@angular/core';
   @Component({
    selector: 'app-header',
    templateUrl: './header.component.html',
    styleUrls: ['./header.component.css']
  })
  export class HeaderComponent{}
  </code></pre>
  
  <p>Header Template:</p>
  
  <pre><code>&lt;sm-menu title="Angular2" class="inverted teal" logo="/assets/images/semantic.png"&gt;
  &lt;a sm-item *ngFor="let item of items" [icon]="item.icon"&gt;{{item?.title}}&lt;/a&gt;
  
  &lt;sm-menu class="menu right secondary"&gt;
  &lt;a sm-item href="#/elements/menu"
     image="http://semantic-ui.com/images/avatar/small/stevie.jpg"&gt;Elliot Fu&lt;/a&gt;
  &lt;a sm-item icon="sidebar big"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>My App Module:</p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { FormsModule } from '@angular/forms';
  import { HttpModule } from '@angular/http';
  
  import { AppComponent } from './app.component';
  import { NgSemanticModule } from "ng-semantic";
  import { HeaderModule } from "./header/";
  
  @NgModule({
   declarations: [
     AppComponent
   ],
   imports: [
      BrowserModule,
      FormsModule,
      HttpModule,
      NgSemanticModule,
      HeaderModule
    ],
    providers: [],
     bootstrap: [ AppComponent ]
  })
  export class AppModule {}
  </code></pre>
  
  <p>App Component: </p>
  
  <pre><code>import { Component } from '@angular/core';
  
  @Component({
   selector: 'app-root',
   template: '&lt;app-header&gt;&lt;/app-header&gt;',
   styleUrls: ['./app.component.css'] 
   })
   export class AppComponent {}
  </code></pre>
  
  <p>Exception: </p>
  
  <pre><code>unhandled Promise rejection: Template parse errors:
  Can't bind to 'ngForOf' since it isn't a known property of 'a'. ("&lt;sm-menu     title="Angular2" class="inverted teal" logo="/assets/images/semantic.png"&gt;
  &lt;a sm-item [ERROR -&gt;]*ngFor="let item of items" [icon]="item.icon"&gt;   {{item?.title}}&lt;/a&gt;
  </code></pre>