Question

我正在开发一个带角度的应用程序。我在*ngFor模板指令中遇到了一个非常奇怪的问题：

<div *ngfor="let accountGroup of groupedAccountsList">
    <h3 class="accounts__identifier">
        {{accountGroup.key}}
    </h3>
    <table class="datalist">
        <tr class="datalist__header">
            <th class="datalist__column">
                {{ 'accounts.number' | translate }}
            </th>
        </tr>
        <tr *ngfor="let account of accountGroup.accounts" class="datalist__row">
            <td class="datalist__column">
                {{account.accountNumber}}
            </td>
        </tr>
    </table>
</div>

这个代码确实有用，当我订阅我的observable并自己进行分组时。实际上，有没有办法以嵌套的方式使用async管道？

我尝试使用以下代码生成带有代码的分组observable，但到目前为止，我实际上订阅了嵌套的observable是不吉利的。

this.resourceService
    .getAccounts(data.client.id)
    .subscribe(accounts => {
        let hash = {};
        for (let acc of accounts) {
            if (!hash[acc.relationship.id]) {
                hash[acc.relationship.id] = [];
            }
            hash[acc.relationship.id].push(acc);
        }
        this.groupedAccountsList = Object.keys(hash).map(key => {
            return {
                key,
                accounts: hash[key]
            };
        });
    });

所有分组都必须通过自定义同步代码完成。必须有类似以下内容（IMO）

this.groupedAccountsList = this.resourceService
    .getAccounts(data.client.id)
    .flatMap<AccountModel>(o => Observable.from(o))
    .groupBy<string, AccountModel>(o => o.relationship.id)
    .map(o => {
         return {
             key: o.key,
             accounts: o.toArray()
        };
    })
    .toArray()

我对observables和RxJS的理解是否存在一般性错误，或者嵌套的异步管道无法正常工作？

干杯

角度嵌套异步ngFor

0 个答案: