Html 可观察<；任何>；不具有约束力

我一直在研究另一个问题，助手已经安静下来了，我需要很快找到一个解决方案

我已经实现了新代码，发现数组正在向浏览器返回“false”：

我已从get请求映射，然后尝试将$bind绑定到click-cards.component.html。然后，这应该过滤掉任何重复记录，并使用lodash将它们呈现到组中

编辑：基于反馈，但结果似乎仍然相同

单击cards.component.ts

import { Component, OnInit } from '@angular/core';
import { Commission } from '../commission';
import { AnalyticsService } from '../analytics.service';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import * as _ from 'lodash';

@Component({
  selector: 'app-click-cards',
  templateUrl: './click-cards.component.html',
  styleUrls: ['./click-cards.component.scss']
})
export class ClickCardsComponent implements OnInit {

  commissions$: Observable<any>;

  constructor(private analyticsService: AnalyticsService) {}

  ngOnInit() {
    this.getCommissions();
  }

  getCommissions(){
    this.commissions$ = this.analyticsService.getAllCommissionData().pipe(
      map((commissions: Commission[]) => {
        if (commissions !== undefined && commissions !== null) {
          return _.uniqBy(commissions, 'url');
        }
      }),
      map((commissions: Commission[]) => {
        commissions = _.groupBy(commissions, commission => commission.page_type);
        return commissions;
      })
    )
  }
}

从'@angular/core'导入{Component，OnInit}；
从“../佣金”进口{佣金}；
从“../analytics.service”导入{AnalyticsService}；
从“rxjs”导入{Observable}；
从“rxjs/operators”导入{map}；
从“lodash”导入*as uuu；
@组成部分({
选择器：“应用程序点击卡”，
templateUrl:'。/单击cards.component.html'，
样式URL:['./单击cards.component.scss']
})
导出类ClickCard组件在该单元上实现{
佣金$：可见；
构造函数（私有分析服务：分析服务）{}
恩戈尼尼特（）{
这个.getCommissions（）；
}
获取佣金（）{
this.commissions$=this.analyticsService.getAllCommissionData（）管道(
map（（佣金：佣金[]）=>{
如果（佣金！==未定义和佣金！==空）{
返回uqby（佣金，'url'）；
}
}),
map（（佣金：佣金[]）=>{
佣金=u.groupBy（佣金，佣金=>佣金.页面类型）；
退货佣金；
})
)
}
}

我似乎找不到一种方法将$s绑定到.html文件：

单击cards.html

<ng-container *ngIf="commissions$ | async as commissions">
  <ng-container *ngFor="let page_type of ['home', 'article','statistics', 'products']">
    <h4>{{ page_type | titlecase }}</h4>
    <p *ngIf="!commissions[page_type]">No {{ page_type }} Commissions Logged Yet</p>
    <ul *ngFor="let card of commissions[page_type]">
      <app-click-card [card]="card"></app-click-card>
    </ul>
  </ng-container>
</ng-container>

{{page_type}titlecase}
尚未记录{{{page_type}}佣金

---

有人知道我做错了什么吗？我通常不处理可观察对象，所以我通常订阅服务REST方法，它可以工作。所以我对这个过程有点陌生。

映射操作符将允许您转换可观测源的值。无论返回什么，都将替换该值。在第二个映射中，您返回true，因此这就是最终的结果值。您应该再次返回转换后的

佣金

值。

此。佣金$

似乎是可观察到的

真值

。使用特定类型，编译器可以帮助您。当您在

ngOnInit（）

中

subscribe

到

getCommissions（）

时，您会得到什么？当我订阅时数组返回。你想查看数据吗？谢谢你的建议，所以第二张地图返回佣金，但是视图仍然显示没有记录家庭佣金，等等。在第二张地图中返回佣金之前，佣金的价值是什么？我已经收到了原始问题的回复。他们建议使用stackblitz的例子。我会看看我能不能让它工作。谢谢你的帮助。如果你想跳到原来的问题上，因为它还没有完全起作用。：）