Angular 将数据附加到子组件
场景:我有一个下拉列表,在其中我选择电影标题,然后点击开始按钮。每一分钟,我的应用程序都会调用api并检查所选电影的预订是否打开。当预订未打开时,应将其记录在类似终端的html容器中。对于每个呼叫,右侧终端应显示Angular 将数据附加到子组件,angular,typescript,Angular,Typescript,场景:我有一个下拉列表,在其中我选择电影标题,然后点击开始按钮。每一分钟,我的应用程序都会调用api并检查所选电影的预订是否打开。当预订未打开时,应将其记录在类似终端的html容器中。对于每个呼叫,右侧终端应显示 有关正在调用的api的信息(在调用期间) 关于电影状态的信息(通话后) 等待(在1分钟间隔内) 从1-3开始 以下是用户界面: 这是我的密码: spicinemas.component.html <div class="container"> <div clas
<div class="container">
<div class="row">
<div class="col-4">
<form [formGroup]="movieForm" (ngSubmit)="getStatus()">
<div class="form-group">
<select class="form-control" id="movie" name="movie" formControlName="movie">
<option *ngFor="let movie of movies" [value]="movie">{{movie}}</option>
</select>
</div>
<button type="submit" class="btn btn-danger btn-block">Start</button>
</form>
</div>
<div class="col-8">
<app-terminal></app-terminal>
</div>
</div>
</div>
目前,终端位于单独的组件中。我需要一个关于如何实现这一点的建议?使用带有主题的服务,将其注入两个组件,从
spicinemas.component.ts
发布日志,并在应用程序终端中订阅
如果您不想在应用程序终端中对数组进行数据绑定,您可以手动将元素附加到那里。使用带有主题的服务,将其注入两个组件,从spicinemas.component.ts
发布日志,然后在应用程序终端中订阅
如果你不想在你的应用程序终端中对数组进行数据绑定,你可以在那里手动添加元素。看看这个:我知道我可以将数据从一个组件发送到另一个组件,但是如何让终端显示数据而不将以前的datause数组作为输入删除问题是,日志会随着时间的推移而累积,如果我将所有日志附加到一个数组中,并将其传递给终端,那么终端应该遍历所有数组并显示。基本上我不想这样,我只想发送当前的日志,终端只是在前一个日志的下面附加它。你可以创建一个方法,以友好的方式插入新行。您可以在父级中访问它并简单地调用它。看这个:我知道我可以将数据从一个组件发送到另一个组件,但是如何让终端显示数据而不将以前的datause数组作为输入擦除问题是,如果我将所有日志附加到一个数组中并将其传递给终端,日志会随着时间的推移而累积,终端应在所有阵列和显示器之间循环。基本上我不想这样,我只想发送当前的日志,终端只是在前一个日志的下面附加它。你可以创建一个方法,以友好的方式插入新行。您可以在父级中访问它,并简单地调用它。
getStatus() {
interval(1 * 60 * 1000)
.pipe(
flatMap(() => this.service.checkStatus(this.movieForm.value.movie))
)
.subscribe(res => {
const response: any = res;
if (!response.status) { // false for booking not opened
// implementation
}
});
}