Angular (4,5) redux - данные подписки - просмотр не обновляется после изменения модели

Question

Я столкнулся с большой проблемой с подписками (Angular).
Я выбираю данные из магазина.после этого я подписываюсь на новый объект (this.jEntry - в этом объекте у меня есть вызов свойства "detail" из API-сервиса, я был консольным журналом, я вижу детализацию списка данных, но детализация объекта все еще this.jEntry.datail= []. Вы можете видеть по изображению.

Вид

<ngx-datatable *ngIf="!loading" class="material" [rows]='this.gridItems' 
[columnMode]="'force'" [headerHeight]="50"
  [footerHeight]="0" [rowHeight]="'auto'">

  <ngx-datatable-column headerClass="border-right" cellClass="border-right" name="Account"  
    prop="accountName" [draggable]="false" [resizeable]="false" [headerTemplate]="filterContentTpl">
    <ng-template let-value="value" ngx-datatable-cell-template>
      {{value}}
    </ng-template>
  </ngx-datatable-column>
  
</ngx-datatable>  

компонент

import {
  Component,
  OnInit,
  Input,
  Output,
  EventEmitter,
  TemplateRef,
  OnChanges,
  SimpleChanges,
  ChangeDetectionStrategy,
  ViewEncapsulation,
  ViewChild,
  NgZone
} from "@angular/core";
import {
  FormBuilder,
  FormGroup,
  FormArray,
  Validators,
  AbstractControl,
  
} from "@angular/forms";
import { Subscription, Observable, Subject } from "rxjs";
import { DatePipe } from "@angular/common";
import { UtilService } from "../../../shared/utility/utility.service";
import { NgbModal } from "@ng-bootstrap/ng-bootstrap";
import * as jentryActions from "../../../shared/store/journalentry/journalentry.action";
import { Store } from "@ngrx/store";
import * as store from "../../../shared/store/";

import { FaceSheetSandbox } from "../../../shared/sandbox/facesheet.sandbox";
import { debounceTime } from 'rxjs/operators';
import { ActivatedRoute, Router } from "@angular/router";
import { NotificationsService } from "angular2-notifications";

import * as journalentryActions from "../../../shared/store/journalentry/journalentry.action";
import { JournalEntryApiClient } from "../../../apis/journalentry-api-client.service";
import {
  User,
  JEntrySearch,
  JEntry,
  JEDetail,
  FiscalMonthModel,
  BillingAccountModel
} from "../../../shared/models";

import * as util from "../../../shared/utility/utility-helpers";
import { s } from "@angular/core/src/render3";
import {
  filterBy,
  getFilterOptions,
  getFilterDefaultValues,
  getFilterCurrencyMask
} from '../../../shared/utility/filtering';
import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap';
import moment = require("moment");
@Component({
  selector: "app-journal-entry-child",
  templateUrl: "./journal-entry-child.component.html",

  encapsulation: ViewEncapsulation.None
})
 
export class JournalEntryChildComponent implements OnInit {
 
  subscriptions: Subscription[] = [];
  jEData$: Observable<JEntry[]>;
  
  jEntry$: any;
  jEntry: JEntry;
  gridItems = [];
  facilityId = null;
 
  currencyMask = getFilterCurrencyMask;
  constructor(private notificationsService: NotificationsService
              , private appState$: Store<store.RootState>
              , private zone: NgZone) {}

  ngOnInit() {
    this.jEntry$ = this.appState$.select(store.getGLCurrentEntry);

    this.subscriptions.push(
      this.jEntry$.subscribe(data => {
        this.zone.run(() => {
          this.jEntry = data;
          console.log("chekc data here", data);
          this.filter();
        });
       
      })
    );

    this.subscriptions.push(
      this.filterSubject.pipe(debounceTime(10000)).subscribe(() => {
        this.filter();
      })
    );
    
    
   filter() {
    let data = this.jEntry.detail; 
    this.gridItems = [...data];
    console.log("check grid", this.gridItems, this.jEntry,                   this.jEntry.detail);
  }
  }
  
  
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.0/angular.min.js"></script>

! [Две куклы] [1]

Пожалуйста, помогите мне.