RxJS + Angular:@Input setter无法从异步源获取更新值

时间:2018-01-26 10:29:13

标签: angular ionic2 rxjs

更新

此问题与我的@Input监视嵌套/数组而不是基元相关联。它仅在引用发生更改时触发setter。

  • 快速和肮脏的修复:

每当将其发送到管道时创建一个新的嵌套/数组:

this._myBehaviorSubject$.next(.this._myBehaviorSubject.getValue().map( entry => entry))

原始问题 这个Ionic 3 / Angular应用程序有一个页面显示来自RxJS observable的数据:

<ion-content padding>
  <ion-item>
    Entry count: {{ (journalService.timelineEntries$ | async)?.length }}
  </ion-item>
  <journal-evo-graph [values]="(journalService.timelineEntries$ | async)"></journal-evo-graph>
</ion-content>

Entry count打印输出只是测试timelineEntries $ stream正确输入正确数量的条目的一种方法。

journal-evo-graph是用于呈现这些值的普通NV-D3图。但是,需要将值转换为与图形兼容。

问题是应该获取timelineEntries $值。

我的journal-evo-graph组件具有@Input属性,如下所示:

export class JournalEvoGraphComponent {

  private _entries: TimelineEntry[];

  @Input('values')
  get values() { return this._entries; }
  set values(entries: TimelineEntry[]) {

    console.log('inbound values ' + entries && entries.length); // stays at 0 even though it fires multiple times

    if(entries && entries.length > 0) {
      this.processTimelineEntries(entries)
    }

    else console.log('no values received.');
  }

  graphOptions:any;

  data: any[];

  constructor() {
    this.initGraphOptions();
    this.initTestData();
  }

我无法确定为什么此组件会在Entry count:打印输出显示正确数量时继续接收空数组。

欢迎任何线索: - )

0 个答案:

没有答案