自动滚动到底部指令在angular 2中不起作用

import { Directive, ElementRef, Renderer2, OnInit } from '@angular/core';

@Directive({
  selector: '[scrollToBottom]'
})
export class ScrollToBottomDirective implements OnInit {

  constructor(private elementRef: ElementRef, private renderer: Renderer2) { }

  ngOnInit() {
    this.scrollToBottom();
  }

  private scrollToBottom() {
    const element = this.elementRef.nativeElement;
    element.scrollTop = element.scrollHeight;
  }
}

<div class="scrollable-content" scrollToBottom>
  <!-- 内容 -->
</div>