Question

目前的行为是什么？

我正在尝试获取自定义类型

的可观察性

export interface ConfigurationState {
  outlet_id: number;
  api_key: string;
}

在我的组件中

@Component({
  selector: 'retail-root',
  templateUrl: './root.component.html',
  styleUrls: ['./root.component.scss']
})
export class RootComponent implements OnInit {
  public config$: Observable<ConfigurationState>;

  constructor(private store: Store<fromRoot.State>) {
    this.config$ = this.store.select(fromRoot.getConfigState);
    this.config$.subscribe(data => console.log(data));
   }

  ngOnInit() {
    console.log(this.config$);
    this.store.dispatch(new configActions.GetConfig());
  }

}

当我使用下面的

时

{{ config$ | async }}

它给了我[object Object]但是如果订阅了，this.config$.subscribe(data => console.log(data));我在控制台中得到了正确的对象。

有人可以帮忙吗？

Answer 1

我想{{config $ | async}}调用对象的.toString（）方法，该方法输出其类型。假设您的“数据”具有“名称”属性，您可以这样做：

{{ (config$ | async).name }}

我猜你也可以这样做

{{ config$ | async | json }}

json pipe将json的内容字符串化。

其他选项是将输出从异步设置为变量并在模板中使用

<div *ngIf="config$ | async as data">
  {{ data.name }}
  {{ data.someAttr }}
  {{ data.otherAttr }}
</div>

ngrx / store：subscribe工作正常，但模板中的异步给出[object Object]

目前的行为是什么？

1 个答案: