Question

我正在设置此代码以打印订阅Feed日期字段：

<div class="col-xs-8">
  <span class="text-light fs-mini m">
    {{((user$ | async).validation) | date: 'dd/MM/yyyy'}}
  </span>
</div>

Angular告诉我：

错误错误：未捕获（在承诺中）：TypeError：co.user未定义

我要说当我添加date管道时会出现问题。 (user$|async).valitation无需格式化即可正常使用。

Answer 1

((user$ | async).validation)解析为undefined，然后传递给日期管道。

我建议您使用组件中的subscription解决问题，然后：

 <div class="col-xs-8">
  <span class="text-light fs-mini m">
    {{ user.validation | date: 'dd/MM/yyyy' }}
  </span>
</div>

或类似的东西：

 <div class="col-xs-8">
  <span *ngIf="user$ | async" class="text-light fs-mini m">
    {{ user$.validation | async | date: 'dd/MM/yyyy' }}
  </span>
</div>

或者创建一个自定义date pipe，接受observables作为参数。

Answer 2

从Angular 6开始（我认为），您也可以在异步上使用as语法。

 <div class="col-xs-8">
  <span *ngIf="user$ | async as user" class="text-light fs-mini m">
    {{ user.validation | date: 'dd/MM/yyyy' }}
  </span>
</div>

本文值得一读Handling Observables with NgIf and the Async Pipe

Angular2：具有异步管道的日期管道

2 个答案: