title: Lint error: Implement lifecycle hook interfaces
body: <p>I got a linting error and I am not sure what it is talking about, this is the error:</p>
  <blockquote>
  <p>src/app/particles/particles.component.ts[4, 1]: Implement lifecycle
  hook interfaces
  (<a href="https://angular.io/docs/ts/latest/guide/style-guide.html#!#09-01" rel="nofollow noreferrer">https://angular.io/docs/ts/latest/guide/style-guide.html#!#09-01</a>)</p>
  </blockquote>
  <p>Row nr 4 is the <code>@Component({</code> line</p>
  <p>I have read the link it gives and I get what it tries to tell me,  but I can't see how it applies in this case.</p>
  <pre><code>import { Component, ViewChild, ElementRef, HostListener} from '@angular/core';
  import { Particle } from './particle';
  
  @Component({
    selector: 'km-particles',
    template: ` &lt;canvas #canvas
                [attr.width]='width'
                [attr.height]='height'
                [style.opacity]='opacity'&gt;
                &lt;/canvas&gt;`
  })
  export class ParticlesComponent {
  
    ...
    // get the element with the #canvas on it
    @ViewChild('canvas') canvas: ElementRef;
  
    // on window resize, restart the animation with the new boundaries
    @HostListener('window:resize', ['$event'])
    OnResize(event: Event) {
      this.initAnim();
    }
  
    constructor() {
      this.opacity = 0;
    }
  
    // wait for the view to init before using the element
    ngAfterViewInit() {
      this.ctx = this.canvas.nativeElement.getContext('2d');
  
      // ok all is ready, start the particle animation
      this.initAnim();
    }
  
    ...
  }
  </code></pre>