我有一个仅在observable
有数据时才显示信息的组件。但是当我尝试在async
上使用observable
运算符时,我看不到任何值。我对异步管道的工作方式感到困惑,我认为初始化可观察对象会花费一些时间,在这种情况下,async pipe
不会对未定义的可观察对象执行任何操作,这就是该组件未显示的原因。
@Component({
template: `
<div *ngIf="todo$ | async as todo">
<div {{todo.name}} </div>
</div>
`
})
export class TodosComponent implements OnInit, OnDestroy {
todo$: Observable<Todo>;
constructor(private store: Store<State>) {}
ngOnInit() {
this.todo$ = this.store
.pipe(select(selectTodos));
}
ngOnDestroy(): void {
}
}
我知道async
管道将处理Observable
,但是如果Observable仍然 undefined 会怎样,异步管道也将处理该情况。如果是这样,则对我可能做错的事情有任何建议,请注意,我已订阅并检查observable是否有数据。
答案 0 :(得分:1)
您应该尝试这个
<ul *ngIf="(todos$ | async).length">
<li *ngFor="let todo of todos$ | async">{{todo.name}}</li>
</ul>
首先,您必须使用* ng;如果需要,则需要使用for循环进行打印
答案 1 :(得分:1)
有两个代码问题。 @Wandrille提到了第一个-您在模板中引用的是df.merge(df.sort_values('VALUE').
drop_duplicates('NAME',keep='last')['NAME'].
reset_index(),on='NAME')
Out[73]:
NAME TIMESTAMP VALUE index
0 AAA 2019-01-01 10 3
1 AAA 2019-01-02 21 3
2 AAA 2019-02-01 30 3
3 AAA 2019-02-02 45 3
4 BBB 2019-01-01 50 7
5 BBB 2019-01-02 60 7
6 BBB 2019-02-01 70 7
7 BBB 2019-02-02 80 7
而不是todos
。另外,对于todo
文本的开始<div>
标签没有闭合的尖括号。我希望这些问题中的任何一个都会导致编译错误。您的代码是否完全符合所列?
另一个可能的问题是,您正在尝试从数组中获取{{todo.name}}
元素(即,name
的类型应该为todos$
)。在这种情况下,您将需要调整类型声明(和Observable<Todo[]>
选择器,如果适用),然后进行适当的迭代:
selectTodos
答案 2 :(得分:1)
异步管道还可以用于多个,延迟的和最初未定义的可观察对象。我进行了一次闪电战以供您查看:
似乎您从未从select(selectTodos)
中获取任何数据