Обнаружение изменений Angular 2 задерживается на несколько секунд с массивами и @Inputs

Question

Я знаю, что в Angular 2 есть тонна информации об обнаружении изменений, и я приложил все усилия, чтобы обдумать это. Я думал, что мои проблемы могут быть связаны со свойствами изменчивости массива, но я не уверен. Итак, у нас есть эти "корзины", поступающие из Firebase, и я помещаю их в массив, который затем передается в дочерний компонент. Все это работает, и Array заполняется довольно быстро, но для его отображения на странице требуется несколько секунд. (Однако, когда я пытаюсь добавить несколько setIntervals и setTimeouts, это работает намного быстрее, но я бы предпочел не делать этот хак, если нет чистого решения таким образом.) Кто-нибудь понимает, что происходит за кулисами достаточно хорошо, чтобы объяснить это мне просто и помочь? Спасибо!

import { Component } from '@angular/core';
import { BucketService } from '../../services';

@Component({
  selector: 'home-page',
  template: `
    <header [title]="'Buckets'"></header>
    <bucketlist [buckets]="buckets"></bucketlist>
  `,
  styleUrls: ['./home.page.scss']
})
export class HomePage {
  buckets: Array<any> = [];
  constructor(public bks: BucketService) {
    bks.subscribe(bucket => {
      console.log('bucket pushed: ', bucket);
      this.buckets.push(bucket);
    });
  }
}

Answer 1

Смотрите решение № 2 здесь: не работает обновление angular2 firebase в реальном времени

"Просто поместите определение внутри класса angular2, а не снаружи, и все начало работать, как я и предполагал изначально".