使用带有承诺来同步数据的lodash链

时间:2017-08-07 07:43:35

标签: angular typescript lodash angular-promise

我正在努力尝试使用lodash链和promise来链接字符串操作。我的refColors.length总是0,我从不输入if语句,因为在测试语句后调用了服务。

我尝试在我的功能中做什么

initiateModalData(refColorList: any) {

    refColorList.forEach((values, index) => {
        const listRefRows: Array<GblRowValues> = [];
        const initialcolors: Array<any> = [];
        const refColors: Array<any> = [];
        const headList: Array<any> = [];
        this.rowId = 1;

         _(value)
                .chain()
                .tap((colors) => {
                    this.myAPIService.getStyle(colors[index].id)
                        .subscribe(styleRef => {
                            if (styleRef) {
                                styleRef.colors.map(color => {
                                    refColors.push(color.colorId);
                                });
                            }
                        });
                })
                .forEach(refSize => {
                    refSize.headList.forEach(item => {
                        headList.push({
                            size: item.size,
                            value: 0
                        });
                    });
                })
                .forEach(val => {
                    initialcolors.push(val.color);
                })
                .forEach((row) => {
                    this.rowId += 1;
                    listRefRows.push(new rowValue(row.headList, initialcolors, this.rowId));
                })
                .value();

            const factory = this.componentFactoryResolver.resolveComponentFactory(ReferenceTableComponent);
            const ref = this.target.createComponent(factory);
            console.log(refColors.length)
            ref.instance.listRows = listRefRows;
            ref.instance.rowId = this.rowId;
            ref.instance.headList = _.uniqBy(headList, 'size');
            if (_.difference(refColors, initialcolors).length !== 0) {
                ref.instance.colors = _.difference(refColors, initialcolors);
                ref.instance.isAddRowValid = true;
            }
    });
  }

我试图把所有的链条部分放在一个新的诺言中然后在那个()中我启动我的组件但是我的组件是在没有数据的情况下启动的

return new Promise((resolve, reject) => {
      _(value)
                .chain()
                .tap((colors) => {
                    this.myAPIService.getStyle(colors[index].id)
                        .subscribe(styleRef => {
                            if (styleRef) {
                                styleRef.colors.map(color => {
                                    refColors.push(color.colorId);
                                });
                            }
                        });
                })
                .forEach(refSize => {
                    refSize.headList.forEach(item => {
                        headList.push({
                            size: item.size,
                            value: 0
                        });
                    });
                })
                .forEach(val => {
                    initialcolors.push(val.color);
                })
                .forEach((row) => {
                    this.rowId += 1;
                    listRefRows.push(new rowValue(row.headList, initialcolors, this.rowId));
                })
                .value();

})
  .then (() => {
     const factory = this.componentFactoryResolver.resolveComponentFactory(ReferenceTableComponent);
            const ref = this.target.createComponent(factory);
            console.log(refColors.length)
            ref.instance.listRows = listRefRows;
            ref.instance.rowId = this.rowId;
            ref.instance.headList = _.uniqBy(headList, 'size');
            if (_.difference(refColors, initialcolors).length !== 0) {
                ref.instance.colors = _.difference(refColors, initialcolors);
                ref.instance.isAddRowValid = true;
            }
  })

1 个答案:

答案 0 :(得分:0)

我通过在订阅后启动我的组件并在最后执行forEach后使用tap()解决了我的问题:

                .tap((colors) => {
                this.myAPIService.getStyle(colors[index].id)
                    .subscribe(styleRef => {
                            if (styleRef) {
                                styleRef.colors.map(color => {
                                    refColors.push(color.colorId);
                                });
                            }
                        },
                            error => this.myNotificationService.error(`${error} !`, 'error'),
                        () => {
                            const factory = this.componentFactoryResolver.resolveComponentFactory(ReferenceTableComponent);
                            const ref = this.target.createComponent(factory);
                            ref.instance.listRows = listRefRows;
                            ref.instance.rowId = this.rowId;
                            ref.instance.headList = _.uniqBy(headList, 'size');
                            if (_.difference(refColors, initialcolors).length !== 0) {
                                ref.instance.colors = _.difference(refColors, initialcolors);
                            }
                        }
                    );
            })