What is the best way to listen for component resize events within an Angular2 component?
<p>I'm writing an Angular2 component that needs to dynamically change its content when resized. I am using the experimental Renderer in @angular/core (v2.1.0) and can wire up a click listener with the following:</p>

<pre><code>this.rollupListener = this.renderer.listen(this.rollUp, 'click', (event) =&gt; {
  ...
});
</code></pre>

<p>But unfortunately I cannot do the same for a resize event - both 'resize' or 'onresize' do not work:</p>

<pre><code>this.resizeListener = this.renderer.listen(this.container, 'resize', (event) =&gt; {
  // this never fires :(
});
</code></pre>

<p>I am able to pick up on browser resize events using the following:</p>

<pre><code>@HostListener('window:resize', ['$event.target'])
onResize() {
  ...
}
</code></pre>

<p>But unfortunately not all component resizing in my application is due to a browser resize.</p>

<p>Basically, I'm looking for the JQuery equivalent of:</p>

<pre><code>$(this.container).resize(() =&gt; {
  ...
});
</code></pre>