Angular 4在console.log中获取数据但不在html中呈现

Question

我具有这些功能，我可以在任何地方访问html中的产品数据，并将这些数据分组到其他变量中，然后就无法在html中访问。

ngOnInit() {

    this.subscriptions.push(this.searchTerms.pipe(
        //wait for specified interval before passing the event further, helps to make sure http request is only made when user finishes typing.
        debounceTime(CONFIG.searchDebounceInterval),
        //check whether the value has changed or not and passes the event further if value did change.
        distinctUntilChanged(),
        //switch to new search observable each time the term changes
        switchMap((term: string) => {

        })).subscribe(
        httpDataPayload => {
            this.httpDataPayload = httpDataPayload;
            this.bindProducts();
        },
        error => this.handleHttpError(error)
    ));
}

groupProduct(objectArray) {
    let property = this.reportType;
   this.projectsGroup = objectArray.reduce(function (acc, obj) {
        let key = obj[property];
        if (!acc[key]) {
            acc[key] = [];
        }
        acc[key].push(obj);
        return acc;
    }, []);

    console.log(this.projectsGroup);
}


bindProducts(): void {
        this.objPager.callFunction = false;
        let records = this.httpDataPayload.records;

        //if server sent some data, add it to the products array
        if (records) {
            let products: Array<Product> = [];

                for (let i = 0, len = records.length; i < len; i++) {
                    products.push(new Product(records[i].record));
                }
            this.products.next(products);
            this.groupProduct(products);
            this.progressService.hide();
        } else {
            this.handleError(this.httpDataPayload);
            this.noResults = true;
        }
    }

注意：objectArray是异步数据

我在console.log中获得了数据，但没有在html中呈现

这是html代码

<div class="table-container">{{projectsGroup|json}}</div>