Angular 如何对异步数据使用属性绑定？

我正在尝试将现有的前端与新的后端连接起来。其中一个前端组件具有以下模板：

<simplex-chart [numbers]="someData"></simplex-chart>

现有的前端相当于一个原型，其中的数据是静态的。在新版本中，数据不再是静态的，而是通过服务来自数据库。因此，上面的属性绑定不再有效。 我如何使它适应异步数据提交？我见过像{{somedata | async}}这样的构造，但我没有找到任何方法将其绑定到输入属性。 有什么建议吗？ 多谢各位，

---

Nicolas

如果

某些数据

是可观察的，您可以使用管道

异步

执行以下操作：

<simplex-chart [numbers]="someData | async"></simplex-chart>

<simplex-chart *ngIf="someData" [numbers]="someData"></simplex-chart>

尝试使用

@Input（）数字：数字[]=[]将空数组作为默认值。
请尝试以下操作：

<ng-container *ngIf="someData | async as data"> 
   <simplex-chart [numbers]="data"></simplex-chart>
</ng-container>


我在发布之前尝试过，但没有成功，引发了以下异常：错误错误：InvalidPipeArguments:在invalidPipeArgumentError（common.js:4013）的管道“AsyncPipe”在AsyncPipe.push../node_modules/@angular/common/fesm5/common.js.AsyncPipe.\u selectStrategy（common.js:4624）在AsyncPipe.push../node_modules/@angular/common/fesm5/common.js.AsyncPipe.\u s。。。不，有些数据不是可观测数据，而是由组件代码从可观测数据订阅的数字数组。你能在stackblitz.com上举个例子吗？正如错误所说，someData是一个数组，那么，当您直接放入
时，会出现什么错误？似乎您不需要管道，因为您直接使用数组是的，我确认someData是一个数字数组。错误为：“错误类型错误：无法读取未定义的属性“map”。引发异常的源代码行是：“data:this.numbers.map（p=>p-15）”，其中数字是“@Input（）numbers:number[]”。我将提供一个示例。我的理解是，ngif只会执行测试，但不会管理数据的异步传输。当然，这样做需要更多的时间，这可能会让操作有更多的机会提前完成。但我不认为这是解决方案。它检查值是否存在，是否有值，并呈现单纯形图