title: Storybook Angular cannot resolve parameters on base class
body: <p>I am in the process of adding storybook into an existing app. Apart from a few painful issue which are now behind me, it's been mostly a success, however I have encountered a new issue.
  I have multiple components which extend from an abstract base class which are complaining they cannot resolve parameters for. EG: <code>Error: Can't resolve all parameters for MyComponent: (?, ?, ?, ?, ?, ?, ?)</code></p>
  <p>This component doesn't have a constructor, but the base class which it extends does, and has 7 params which matches the 7 question marks.
  I have provided classes for storybook to use through <code>moduleMetadata</code>, which worked for other components which have their own constructor, but isn't working for these one.</p>
  <p>If I had a fake constructor to just pass the params to super() it then works, but I don't want to have to add this pointless constructor in for all such components.</p>
  <p>Below is a very stripped example of the code.</p>
  <p>Story file:</p>
  <pre class="lang-js prettyprint-override"><code>export default {
    title: 'My Stories',
    component: MyComponent,
    decorators: [
      withKnobs,
      moduleMetadata({
        imports: [
          // Import some modules needed here
        ],
        providers: [
          // I pass in all my services here, these are the 7 params needed for the component's base class
        ],
        declarations: [
          // Required child components are here
        ],
      }),
    ],
  };
  
  export const ComponentStory = () =&gt; ({
    component: MyComponent,
    props: {},
  });
  </code></pre>
  <p>Component file:</p>
  <pre class="lang-js prettyprint-override"><code>@Component({
    selector: 'app-my-component',
    templateUrl: './my.component.html',
    styleUrls: ['./my.component.scss'],
  })
  export class MyComponent extends BaseComponent {
    //Implementation here - No constructor
  }
  </code></pre>
  <p>Base Component file:</p>
  <pre class="lang-js prettyprint-override"><code>export abstract class BaseComponent implements OnInit, OnDestroy {
    constructor(
      protected firstService: FirstService,
      protected router: Router,
      protected ngProgress: NgProgress,
      protected secondService: SecondService,
      protected thirdService: ThirdService,
      protected forthService: ForthService,
      public fifthService: FifthService
    ) {
      // Some other code here
    }
  
    // Implementation...
  }
  </code></pre>
  <p>With the above, I get the error regarding unresolved parameters.
  If, however I add the below into the component file, it then works just fine and mounts the component into storybook as expected:</p>
  <pre class="lang-js prettyprint-override"><code>  constructor(
      protected firstService: FirstService,
      protected router: Router,
      protected ngProgress: NgProgress,
      protected secondService: SecondService,
      protected thirdService: ThirdService,
      protected forthService: ForthService,
      public fifthService: FifthService
    ) {
      super(
        firstService,
        router,
        ngProgress,
        secondService,
        thirdService,
        forthService,
        fifthService
      );
    }
  </code></pre>
  <p>However, as you can imagine, I do not want to have to add a pointless constructor to all these components which extend this base class without their own constructor just for the sake of storybook.</p>
  <p>Can anybody suggest what else I could try, or what I might be missing?
  Many thanks.</p>
  <p><strong>tl:dr</strong>
  Component in storybook cannot resolve parameters for abstract base class unless I add a constructor to component and pass these values to super(), what do?</p>